domma-cms 0.75.0 → 0.76.0

package/plugins/_lib/admin/mail/compose-window.js

@@ -72,6 +72,7 @@ import {applyIdentity, findIdentity, identityFrom, swapSignature} from './identi
 import {describeWhen, quickTimes} from './scheduling.js';
 import {applyTemplate, expandTemplate} from './templates.js';
 import {makeResizable} from './resizable.js';
+import {whenClosed} from './when-closed.js';
 import {
     collectGroups,
     currentFragment,
@@ -509,16 +510,6 @@ export function openCompose({
     }
     form.appendChild(bodyWrap);
 
-    // What the window opened showing, read back out of the thing showing it.
-    //
-    // NOT `draft.body`: the editor is seeded from `draft.html` and derives its
-    // own text from that, so the two already differed on every HTML reply -
-    // which is why discarding an untouched reply asked whether to lose
-    // changes nobody had made. A signature makes that worse, since it means
-    // even a new message opens "changed". Comparing against what was actually
-    // put in front of the person is both the fix and the only baseline that
-    // stays true once anything else seeds the body.
-    const openedText = editor ? editor.getText() : bodyInput.value;
 
     // Attachments
     // Seeded from the draft, so reopening one keeps the files that were
@@ -653,7 +644,13 @@ export function openCompose({
     const saveDraftBtn = document.createElement('button');
     saveDraftBtn.className = 'btn btn-sm btn-ghost';
     saveDraftBtn.textContent = 'Save draft';
-    saveDraftBtn.addEventListener('click', async () => {
+    /**
+     * Save this message to the mailbox's Drafts folder - the button, and what
+     * leaving the screen does with a message that has changed.
+     *
+     * @returns {Promise<object|null>} the server's answer, or null if it failed
+     */
+    async function saveDraft() {
         saveDraftBtn.disabled = true;
         say('Saving\u2026');
         try {
@@ -663,47 +660,56 @@ export function openCompose({
                 replaces: savedUid
             });
             savedUid = result.uid ?? savedUid;
+            // Saved is the new baseline: closing now loses nothing.
+            savedSnapshot = snapshot();
             say(`Saved to ${result.savedTo}.`, 'ok');
             // The Drafts folder now holds a different set of UIDs, so a list
             // showing it is out of date whether or not the window closes.
             onSaved(result);
+            return result;
         } catch (err) {
             say(err.message, 'bad');
+            return null;
         } finally {
             saveDraftBtn.disabled = false;
         }
-    });
+    }
+    saveDraftBtn.addEventListener('click', () => { saveDraft(); });
 
     const cancel = document.createElement('button');
     cancel.className = 'btn btn-sm btn-ghost';
     cancel.textContent = 'Discard';
-    cancel.addEventListener('click', async () => {
-        // Closing on something half-written should ask, because the window is
-        // the only place that text exists until it is saved.
+    /** What the message says now - compared with the last saved (or opened) state. */
+    function snapshot() {
         const current = editor ? editor.getText() : bodyInput.value;
-        const changed = subjectInput.value.trim() !== (draft.subject ?? '').trim()
-            || current.trim() !== openedText.trim();
-        // A reopened draft is already saved, so closing it unchanged is not a
-        // loss and should not ask. Changed since opening, it is.
-        //
-        // `changed` is the whole test. A new message that has had a subject
-        // typed into it is already changed, because a new draft opens with an
-        // empty one - so the extra "or the subject is non-empty" clause this
-        // used to carry caught nothing new, and DID catch every reply and
-        // forward, which open with `Re:` / `Fwd:` prefilled and so were
-        // always treated as unsaved work.
-        const unsaved = changed;
-        if (unsaved) {
-            // Two different losses, and saying the wrong one is worse than
-            // saying nothing: one has never been saved, the other has changes
-            // since it was.
-            const question = savedUid
-                ? 'Close without saving? The changes since you opened this draft will be lost.'
-                : 'Discard this message? It has not been saved as a draft.';
-            if (!await E.confirm(question)) return;
-        }
-        slideover.close();
-    });
+        return JSON.stringify([subjectInput.value.trim(), current.trim(), toInput.value.trim(),
+            ccInput.value.trim(), bccInput.value.trim(), attachments.length]);
+    }
+    let savedSnapshot = null;   // set once the window is built (below)
+
+    /**
+     * Whether closing now would lose something.
+     *
+     * Compared with the last saved state, or what the window opened with - so
+     * a reopened draft closed unchanged does not ask, and a reply or forward,
+     * which opens with `Re:` / `Fwd:` and a quote already in it, does not
+     * count as unsaved work until the reader actually changes something.
+     */
+    function unsaved() {
+        return savedSnapshot !== null && snapshot() !== savedSnapshot;
+    }
+
+    // Discard, the X, Escape and the backdrop all go through slideover.close,
+    // which asks (see the guard at the end) - so this button just closes.
+    cancel.addEventListener('click', () => slideover.close());
+
+    /** The question the close guard asks, for what would be lost. */
+    function discardQuestion() {
+        return savedUid
+            ? 'Close without saving? The changes since you last saved this draft will be lost.'
+            : 'Discard this message? It has not been saved as a draft.';
+    }
+
 
     /**
      * The message as it currently stands.
@@ -855,7 +861,7 @@ export function openCompose({
                 replaces: savedUid
             });
 
-            slideover.close();
+            slideover.close(true);
 
             // Three outcomes, three different things to say. A message held
             // for ten seconds has NOT been sent, and saying it has is how
@@ -905,10 +911,61 @@ export function openCompose({
         }
     }, 60);
 
+    // The baseline for "changed": what the window opened showing, read back out
+    // of the thing showing it (taken once the editor has been seeded).
+    //
+    // NOT `draft.body`: the editor is seeded from `draft.html` and derives its
+    // own text from that, so the two already differed on every HTML reply -
+    // which is why discarding an untouched reply asked whether to lose
+    // changes nobody had made. A signature makes that worse, since it means
+    // even a new message opens "changed". Comparing against what was actually
+    // put in front of the person is both the fix and the only baseline that
+    // stays true once anything else seeds the body.
+    setTimeout(() => { if (savedSnapshot === null) savedSnapshot = snapshot(); }, 0);
+
+    // Every way out asks when something would be lost - Discard, the X, Escape
+    // and the backdrop all call close(). Once closed it goes straight through:
+    // a later close() (the cleanup below, or the screen being left) must not ask again.
+    const rawClose = slideover.close.bind(slideover);
+    let closed = false;
+    let asking = false;
+    const closedListeners = [];
+    slideover.close = async (force) => {
+        if (!closed && force !== true && unsaved()) {
+            if (asking) return undefined;
+            asking = true;
+            // Two different losses, and saying the wrong one is worse than
+            // saying nothing: one has never been saved, the other has changes
+            // since it was.
+            const ok = await E.confirm(discardQuestion());
+            asking = false;
+            if (!ok) return undefined;
+        }
+        if (closed) return undefined;
+        closed = true;
+        return rawClose();
+    };
+
     // The editor is a live component with its own listeners and autosave.
-    slideover.on?.('close', () => {
+    whenClosed(slideover, () => {
+        closed = true;
         editor?.destroy?.();
         stopResizing();
         for (const suggester of suggesters) suggester.destroy?.();
+        closedListeners.splice(0).forEach(fn => { try { fn(); } catch { /* ignore */ } });
+        // Domma hides a closed slideover rather than removing it: every message
+        // written would otherwise leave its window behind in the page.
+        setTimeout(() => { try { slideover.element?.remove(); } catch { /* gone */ } }, 400);
     });
+
+    return {
+        /** Whether closing would lose something the reader wrote. */
+        dirty: () => !closed && unsaved(),
+        /** Save to Drafts now (what leaving the screen does with a changed message). */
+        saveDraft,
+        /** Close; `true` skips the question. */
+        close: (force) => slideover.close(force),
+        /** Called once, when the window has closed however it closed. */
+        onClosed: (fn) => { if (closed) fn(); else closedListeners.push(fn); }
+    };
 }

package/plugins/_lib/admin/mail/contacts.js

@@ -28,7 +28,10 @@
  * not hold. A 404 here is indistinguishable from "not installed", which is
  * exactly the behaviour wanted.
  */
-const CONTACTS_ENDPOINT = '/api/plugins/contacts/contacts';
+// Core since 0.67.0 (it was the Contacts plugin, at /api/plugins/contacts/contacts:
+// that address has 404'd ever since, so "Add sender to contacts" and group
+// expansion in compose silently vanished).
+const CONTACTS_ENDPOINT = '/api/contacts/contacts';
 
 /**
  * Fetch the address book once.

package/plugins/_lib/admin/mail/diagnostics-section.js

@@ -129,5 +129,8 @@ export function createDiagnosticsSection(host) {
         container.appendChild(actions);
     }
 
-    return {id: 'diagnostics', label: 'Diagnostics', render};
+    return {
+        id: 'diagnostics', label: 'Diagnostics', render,
+        help: 'What this screen can see about itself - whether it runs the build the server is serving, the mailbox and folder, where the list came from, and recent errors. Copy diagnostics puts it on the clipboard for a report.'
+    };
 }

package/plugins/_lib/admin/mail/folder-tree.js

@@ -245,7 +245,7 @@ export function folderMenuItems(roots, {current = null, onPick, label = null}) {
             return {
                 label: node.name,
                 icon: iconForFolder(node),
-                submenu: [target(node), {type: 'separator'}, ...walk(node.children)]
+                submenu: [target(node), {type: 'divider'}, ...walk(node.children)]
             };
         });
     }

package/plugins/_lib/admin/mail/image-senders-section.js

@@ -11,23 +11,29 @@
  * @module _lib/admin/mail/image-senders-section
  */
 
+/** The status line's colour, by tone - classes, so a theme override reaches it. */
+const TONE = {ok: 'text-success', bad: 'text-danger', quiet: 'text-muted'};
+
 /**
- * Say something in a status line, in the right colour.
- *
- * A class rather than `style.color`: an inline colour cannot read a `--dm-*`
- * token that a theme override has redefined, so a status set that way is the
- * same shade in every theme.
- *
- * @param   {HTMLElement} el
- * @param   {string} text
- * @param   {'ok'|'bad'|'quiet'} [tone]
- * @param   {string} [base] - the layout classes the line always carries
- * @returns {void}
+ * The section's markup. Its own DOM, never passed through `_.render`, so the
+ * row's `{{address}}` is the list's template and not eaten on the way in.
  */
-function say(el, text, tone = 'quiet', base = 'text-sm mail-status') {
-    el.textContent = text ?? '';
-    el.className = `${base} ` + ({ok: 'text-success', bad: 'text-danger'}[tone] ?? 'text-muted');
-}
+const TEMPLATE = `
+<div class="mail-image-senders">
+    <p class="text-sm text-muted mb-3">Remote images are blocked by default, because loading one tells the sender that the message was opened and who opened it. Senders listed here are trusted, and their images load without asking.</p>
+    <label class="mail-toggle-row text-sm">
+        <input type="checkbox" class="mail-remember" data-bind-checked="remember.value">
+        Offer to remember senders
+    </label>
+    <p class="text-sm text-muted mail-none" data-bind-hidden="senders.value.length">No senders trusted yet.</p>
+    <div class="mail-sender-list" data-each="senders.value key=address">
+        <div class="mail-box-row" data-address="{{address}}">
+            <span class="flex-1 text-sm mail-ellipsis">{{address}}</span>
+            <button type="button" class="btn btn-sm btn-ghost text-danger mail-untrust" data-bind-disabled="busy">Stop trusting</button>
+        </div>
+    </div>
+    <div data-bind-class="'text-sm mail-status mt-2 ' + statusClass.value" data-bind-text="status.value"></div>
+</div>`;
 
 /**
  * @param   {HTMLElement} container
@@ -43,89 +49,62 @@ async function render(container, ctx) {
     const params = new URLSearchParams({account: ctx.account.id});
     const data = await ctx.api(`${ctx.base}/image-senders?${params}`);
 
-    const intro = document.createElement('p');
-    intro.className = 'text-sm text-muted mb-3';
-    intro.textContent = 'Remote images are blocked by default, because loading one tells the sender that the message was opened and who opened it. Senders listed here are trusted, and their images load without asking.';
-    container.appendChild(intro);
-
-    const toggleRow = document.createElement('label');
-    toggleRow.className = 'mail-toggle-row text-sm';
-    const toggle = document.createElement('input');
-    toggle.type = 'checkbox';
-    toggle.checked = data.remember !== false;
-    toggleRow.appendChild(toggle);
-    toggleRow.appendChild(document.createTextNode('Offer to remember senders'));
-    container.appendChild(toggleRow);
-
-    const list = document.createElement('div');
-    list.className = 'mail-sender-list';
-    container.appendChild(list);
-
-    const status = document.createElement('div');
-    status.className = 'text-sm mail-status text-muted mt-2';
-    container.appendChild(status);
-
-    /**
-     * @param   {string[]} senders
-     * @returns {void}
-     */
-    function paint(senders) {
-        list.textContent = '';
-        if (!senders.length) {
-            const empty = document.createElement('p');
-            empty.className = 'text-sm text-muted mail-none';
-            empty.textContent = 'No senders trusted yet.';
-            list.appendChild(empty);
-            return;
-        }
+    // ---- State ----
+    const busy = new Set();
+    const list = M.observable((data.senders ?? []).map(address => ({address, busy: false})));
+    const remember = M.observable(data.remember !== false);
+    const status = M.observable('');
+    const tone = M.observable('quiet');
+    const say = (text, t = 'quiet') => { status.value = text ?? ''; tone.value = t; };
+    const paint = (senders) => { list.value = senders.map(address => ({address, busy: busy.has(address)})); };
 
-        for (const address of senders) {
-            const row = document.createElement('div');
-            row.className = 'mail-box-row';
-
-            const name = document.createElement('span');
-            name.className = 'flex-1 text-sm mail-ellipsis';
-            name.textContent = address;
-            row.appendChild(name);
-
-            const remove = document.createElement('button');
-            remove.className = 'btn btn-sm btn-ghost';
-            remove.classList.add('text-danger');
-            remove.textContent = 'Stop trusting';
-            remove.addEventListener('click', async () => {
-                remove.disabled = true;
-                try {
-                    const query = new URLSearchParams({account: ctx.account.id, address});
-                    const result = await ctx.api(`${ctx.base}/image-senders?${query}`, 'DELETE');
-                    paint(result.senders);
-                    say(status, `Images from ${address} will be blocked again.`,
-                        'quiet', 'text-sm mail-status mt-2');
-                } catch (err) {
-                    say(status, err.message, 'bad', 'text-sm mail-status mt-2');
-                    remove.disabled = false;
-                }
-            });
-            row.appendChild(remove);
-            list.appendChild(row);
+    async function untrust(address) {
+        busy.add(address);
+        paint(list.peek().map(r => r.address));
+        try {
+            const query = new URLSearchParams({account: ctx.account.id, address});
+            const result = await ctx.api(`${ctx.base}/image-senders?${query}`, 'DELETE');
+            busy.delete(address);
+            paint(result.senders ?? []);
+            say(`Images from ${address} will be blocked again.`);
+        } catch (err) {
+            busy.delete(address);
+            paint(list.peek().map(r => r.address));
+            say(err.message, 'bad');
         }
     }
 
-    paint(data.senders ?? []);
-
-    toggle.addEventListener('change', async () => {
+    async function saveRemember(wanted) {
+        remember.value = wanted;
         try {
-            const result = await ctx.api(`${ctx.base}/image-senders/remember?${params}`, 'PUT',
-                {remember: toggle.checked});
-            status.className = 'text-sm mail-status mt-2 text-muted';
-            status.textContent = result.remember
-                ? 'Senders can be remembered.'
-                : 'Remembering is off. The list is kept but ignored.';
+            const result = await ctx.api(`${ctx.base}/image-senders/remember?${params}`, 'PUT', {remember: wanted});
+            say(result.remember ? 'Senders can be remembered.' : 'Remembering is off. The list is kept but ignored.');
         } catch (err) {
-            say(status, err.message, 'bad', 'text-sm mail-status mt-2');
-            toggle.checked = !toggle.checked;
+            remember.value = !wanted;
+            say(err.message, 'bad');
         }
+    }
+
+    const holder = document.createElement('div');
+    holder.innerHTML = TEMPLATE.trim();
+    const root = holder.firstElementChild;
+    container.appendChild(root);
+    M.applyBindings({
+        senders: list, remember, status,
+        statusClass: M.computed(() => TONE[tone.value] ?? TONE.quiet)
+    }, root);
+    root.querySelector('.mail-remember').addEventListener('change', (event) => saveRemember(event.target.checked));
+
+    // One listener for every row's button - the rows are re-rendered by the list.
+    root.addEventListener('click', (event) => {
+        const button = event.target.closest('.mail-untrust');
+        const row = button?.closest('[data-address]');
+        if (row && !button.disabled) untrust(row.dataset.address);
     });
 }
 
 /** The section both editions show. */
-export const imageSendersSection = {id: 'images', label: 'Images', render};
+export const imageSendersSection = {
+    id: 'images', label: 'Images', render,
+    help: 'Pictures in mail are blocked until you ask for them, because loading one tells the sender you opened it. Senders listed here are trusted: their pictures load straight away.'
+};

package/plugins/_lib/admin/mail/mail.css

@@ -1 +1 @@
-#view-container.mail-fullbleed{max-width:none}.mail-layout [hidden],.dm-slideover [hidden]{display:none!important}.mail-reader-summary{display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap}.mail-header-toggle,.mail-extras-toggle{padding:0!important;font-size:.78rem;opacity:.75;text-decoration:underline}.mail-header-toggle:hover,.mail-extras-toggle:hover{opacity:1}.mail-header-details{display:grid;grid-template-columns:max-content 1fr;gap:.15rem .75rem;margin:.5rem 0 0;font-size:.8rem}.mail-header-details dt{opacity:.65}.mail-header-details dd{margin:0;overflow-wrap:anywhere}.mail-layout{display:grid;grid-template-columns:var(--mail-col-1, 190px) auto var(--mail-col-2, 340px) auto 1fr;height:calc(100vh - 140px);min-height:320px;border:1px solid var(--dm-border, #e2e8f0);border-radius:var(--dm-radius-md, 8px);overflow:hidden;background:var(--dm-surface, #fff)}.mail-folders-pane,.mail-list-pane{display:flex;flex-direction:column;border-right:1px solid var(--dm-border, #e2e8f0);min-width:0;min-height:0}.mail-reader-pane{display:flex;flex-direction:column;min-width:0;min-height:0}.mail-pane-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem .75rem;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--dm-text-muted, #64748b);border-bottom:1px solid var(--dm-border, #e2e8f0);flex-shrink:0}.mail-folders-list,.mail-list{overflow-y:auto;flex:1;min-height:0}.mail-search{display:flex;align-items:center;gap:.4rem;padding:.4rem .6rem;border-bottom:1px solid var(--dm-border, #e2e8f0);color:var(--dm-text-muted, #64748b);flex-shrink:0}.mail-search input{flex:1;min-width:0;font-size:.85rem;padding:.25rem .4rem}.mail-search-note{padding:.3rem .6rem;font-size:.74rem;color:var(--dm-text-muted, #64748b);border-bottom:1px solid var(--dm-border, #e2e8f0);flex-shrink:0}.mail-slideover-resizer{padding:0;position:absolute;left:0;top:0;bottom:0;width:6px;cursor:col-resize;z-index:2;background:transparent}.mail-slideover-resizer:hover,.is-resizing>.mail-slideover-resizer{background:var(--dm-primary, #2563eb);opacity:.7}.is-resizing{user-select:none;transition:none!important}.mail-selection{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;padding:.35rem .6rem;font-size:.78rem;background:var(--dm-primary, #2563eb);color:#fff;flex-shrink:0}.mail-selection span{flex:1;min-width:0}.mail-selection .btn{color:#fff;border:1px solid currentColor;background:transparent}.mail-selection .btn:hover{background:#ffffff26}.mail-item.is-selected{background:var(--dm-active-bg, rgba(15, 23, 42, .07));box-shadow:inset 3px 0 0 var(--dm-primary, #2563eb)}.mail-undo{display:flex;align-items:center;gap:.5rem;padding:.4rem .6rem;font-size:.78rem;background:var(--dm-active-bg, rgba(15, 23, 42, .07));border-bottom:1px solid var(--dm-border, #e2e8f0);flex-shrink:0}.mail-undo span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-splitter{width:5px;cursor:col-resize;background:var(--dm-border, #e2e8f0);flex-shrink:0;background-clip:content-box;border-left:2px solid transparent;border-right:2px solid transparent;box-sizing:content-box}.mail-splitter:hover,.mail-layout.is-resizing .mail-splitter{background-color:var(--dm-primary, #2563eb)}.mail-layout.is-resizing{user-select:none}.mail-layout.is-resizing .mail-folders-pane,.mail-layout.is-resizing .mail-list-pane,.mail-layout.is-resizing .mail-reader-pane,.mail-layout.is-resizing iframe{pointer-events:none}.mail-unread-filter{display:flex;align-items:center;gap:.3rem;font-size:.7rem;text-transform:none;letter-spacing:0;cursor:pointer;margin-left:auto;margin-right:.25rem}.mail-unread-pill{flex-shrink:0;min-width:1.15rem;padding:0 .3rem;border-radius:999px;background:var(--dm-primary, #2563eb);color:#fff;font-size:.66rem;font-weight:700;line-height:1.35;text-align:center}.mail-folder.is-context .mail-folder-name{opacity:.6}.mail-account{display:flex;align-items:center;gap:.4rem;width:100%;padding:.45rem .6rem;border:none;background:var(--dm-surface, #fff);cursor:pointer;text-align:left;font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--dm-text-muted, #64748b)}.mail-account:hover{background:var(--dm-hover-bg, rgba(15, 23, 42, .04))}.mail-account.is-active{color:var(--dm-text, #1e293b);position:sticky;top:0;z-index:1;background:var(--dm-surface, #fff)}.mail-account-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-folder{display:flex;align-items:center;gap:.5rem;padding:.45rem .75rem;font-size:.875rem;cursor:pointer;border:none;background:none;width:100%;text-align:left;color:var(--dm-text, #1e293b)}.mail-folder:hover{background:var(--dm-hover-bg, rgba(15, 23, 42, .04))}.mail-folder.is-active{background:var(--dm-active-bg, rgba(15, 23, 42, .07));color:var(--dm-primary, #2563eb);font-weight:600}.mail-folder.is-unselectable{opacity:.6;cursor:default}.mail-folder.is-unselectable:hover{background:none}.mail-folder-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-item{display:block;width:100%;text-align:left;padding:.55rem .75rem;border:none;border-bottom:1px solid var(--dm-border, #e2e8f0);background:none;cursor:pointer;color:var(--dm-text, #1e293b)}.mail-item:hover{background:var(--dm-hover-bg, rgba(15, 23, 42, .04))}.mail-item.is-active{background:var(--dm-active-bg, rgba(15, 23, 42, .07))}.mail-item-top{display:flex;justify-content:space-between;gap:.5rem;align-items:baseline}.mail-item-from{font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-item.is-unread .mail-item-from,.mail-item.is-unread .mail-item-subject{font-weight:700}.mail-item-date{font-size:.72rem;color:var(--dm-text-muted, #64748b);flex-shrink:0}.mail-item-subject{font-size:.82rem;margin-top:.1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-item-meta{display:flex;align-items:center;gap:.35rem;margin-top:.15rem;color:var(--dm-text-muted, #64748b)}.mail-pager{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.4rem .6rem;border-top:1px solid var(--dm-border, #e2e8f0);font-size:.75rem;color:var(--dm-text-muted, #64748b);flex-shrink:0}.mail-reader-head{padding:.75rem 1rem;border-bottom:1px solid var(--dm-border, #e2e8f0);flex-shrink:0}.mail-reader-head:empty{display:none}.mail-reader-subject{font-size:1.05rem;font-weight:600;margin:0 0 .3rem;color:var(--dm-text, #1e293b)}.mail-reader-actions{display:flex;gap:.25rem;margin:.1rem 0 .35rem;flex-wrap:wrap}.mail-reader-meta{font-size:.8rem;color:var(--dm-text-muted, #64748b)}.mail-reader-body{flex:1;position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:0;background:var(--dm-surface, #fff)}.mail-reader-body iframe{width:100%;flex:1;border:none;display:block;background:#fff}.mail-notice{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;padding:.4rem .75rem;font-size:.78rem;background:var(--dm-warning, #8a6d1f);color:var(--dm-warning-text, #fff);border-bottom:1px solid var(--dm-border, #e2e8f0)}.mail-notice .btn{color:var(--dm-warning-text, #fff);border:1px solid currentColor;background:transparent;opacity:.95}.mail-notice .btn:hover{background:#ffffff26;opacity:1}.mail-attachments{display:flex;flex-wrap:wrap;gap:.4rem;padding:.5rem .75rem;border-bottom:1px solid var(--dm-border, #e2e8f0);background:var(--dm-background-alt, rgba(15, 23, 42, .03))}.mail-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;height:100%;color:var(--dm-text-muted, #94a3b8);text-align:center;padding:1rem}.mail-empty p{margin:0;font-size:.875rem}@media(max-width:900px){.mail-layout{grid-template-columns:1fr;height:auto!important}.mail-splitter{display:none}.mail-folders-pane,.mail-list-pane{border-right:none;border-bottom:1px solid var(--dm-border, #e2e8f0)}.mail-folders-list,.mail-list{max-height:240px}.mail-reader-body{min-height:60vh}}.mail-box-row{display:flex;align-items:center;gap:.5rem;padding:.5rem .6rem;border:1px solid var(--dm-border, #e2e8f0);border-radius:var(--dm-radius-md, 6px)}.mail-item.is-dragging{opacity:.45}.mail-folder.is-drop-target{background:var(--dm-primary, #2563eb);color:#fff;outline:2px solid var(--dm-primary, #2563eb);outline-offset:-2px}.mail-folder.is-drop-target .mail-folder-name,.mail-folder.is-drop-target .mail-unread-pill{color:inherit}.mail-item.is-dragging *{pointer-events:none}.mail-item{position:relative}.mail-item-tick{position:absolute;left:.45rem;top:.55rem;display:inline-flex;opacity:0;color:var(--dm-text-muted, #64748b);transition:opacity .12s ease;padding:2px;margin:-2px;border-radius:var(--dm-radius-sm, 3px)}.mail-item:hover .mail-item-tick,.mail-item:focus-visible .mail-item-tick,.mail-list.is-selecting .mail-item-tick,.mail-item-tick[aria-checked=true]{opacity:1}.mail-item-tick[aria-checked=true]{color:var(--dm-primary, #2563eb)}.mail-item-tick:hover{color:var(--dm-primary, #2563eb);background:var(--dm-hover-bg)}.mail-item-top,.mail-item-subject,.mail-item-meta{padding-left:1.5rem}.mail-select-all{display:inline-flex;align-items:center;margin-right:.1rem;cursor:pointer}.mail-select-all input{cursor:pointer;margin:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mail-item-meta>span{display:inline-flex}.mail-item-meta .is-high{color:var(--dm-danger, #dc2626)}.mail-item-meta .is-low{color:var(--dm-text-muted, #64748b);opacity:.7}.mail-folder.is-hidden-folder .mail-folder-name{opacity:.5;font-style:italic}.mail-thread-chip{display:inline-flex;align-items:center;margin-left:.4rem;padding:0 .35rem;border-radius:999px;font-size:.68rem;font-weight:700;line-height:1.5;color:var(--dm-text-muted, #64748b);background:var(--dm-active-bg, rgba(15, 23, 42, .07));cursor:pointer}.mail-thread-chip:hover{color:var(--dm-primary, #2563eb)}.mail-thread-chip.is-unread{background:var(--dm-primary, #2563eb);color:#fff}.mail-item.is-in-thread{padding-left:1.6rem;box-shadow:inset 3px 0 0 var(--dm-border, #e2e8f0)}.mail-item.is-in-thread .mail-item-from{font-size:.8rem}.mail-pane-head .btn.is-on{color:var(--dm-primary, #2563eb);background:var(--dm-active-bg, rgba(15, 23, 42, .07))}#mail-outbox-btn{font-size:.72rem;font-weight:700}#mail-outbox-btn.is-failed{color:var(--dm-danger, #dc2626)}.mail-attachment{display:inline-flex;align-items:center;border:1px solid var(--dm-border, #e2e8f0);border-radius:var(--dm-radius-md, 6px);overflow:hidden}.mail-attachment .btn{border:none;border-radius:0}.mail-attachment-save{padding-left:.4rem!important;padding-right:.4rem!important;border-left:1px solid var(--dm-border, #e2e8f0)!important;opacity:.7}.mail-attachment-save:hover{opacity:1;color:var(--dm-primary, #2563eb)}.mail-section-heading{margin:1rem 0 .1rem;font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:var(--dm-text-muted, #64748b)}.mail-section-heading:first-child{margin-top:.25rem}.mail-section-form .domma-form{margin:0}.mail-section-form .domma-form-field:last-child{margin-bottom:0}.mail-item-card{margin:0}.mail-item-card .card-header{padding:.5rem .6rem}.mail-item-card .card-body{padding:.6rem}.mail-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.mail-status{min-height:1.2em}.mail-empty-line{margin:.25rem 0}.mail-editor-fallback{min-height:8rem;font-family:inherit;resize:vertical}.mail-clause{display:flex;gap:.3rem;align-items:center;flex-wrap:wrap}.mail-clause .form-select,.mail-clause .form-input{width:auto;flex:0 1 auto}.mail-clause .mail-clause-value{flex:1 1 8rem;min-width:8rem}.mail-section-list{display:flex;flex-direction:column;gap:.5rem}.mail-scroll-sm{max-height:20vh;overflow-y:auto}.mail-scroll-md{max-height:46vh;overflow-y:auto}.mail-section-form .domma-form-field:has(select) .form-label .text-danger{display:none}.mail-compose-form{padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.6rem;height:100%}.mail-compose-body{display:flex;flex-direction:column;flex:1;min-height:0}.mail-compose-editor{flex:1;min-height:0}.mail-compose-textarea{flex:1;min-height:34vh;font-family:inherit;resize:vertical}.mail-attach-list{display:flex;flex-direction:column;gap:.2rem}.mail-template-row{margin:-.15rem 0 .35rem}.mail-template-picker{max-width:16rem}.mail-suggest-row{display:flex;flex-direction:column;line-height:1.25}.mail-suggest-detail{opacity:.7}.mail-rule-off{opacity:.55}.mail-panel{padding:.25rem 0 .5rem}.mail-panel-stack{padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:1rem}.mail-form-stack{padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem}.mail-dialog-stack{display:flex;flex-direction:column;gap:.5rem;padding:.25rem 0}.mail-hint{margin-top:.2rem}.mail-box-sub{overflow:hidden;text-overflow:ellipsis}.mail-add-btn{align-self:flex-start;margin-top:.5rem}.mail-none{margin:0;padding:.5rem .6rem}.mail-kv{padding:.5rem 0;display:flex;flex-direction:column;gap:.35rem}.mail-kv-row{display:flex;gap:.75rem}.mail-kv-key{min-width:8.5rem;flex-shrink:0}.mail-toggle-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.mail-sender-list{display:flex;flex-direction:column;gap:.2rem;max-height:40vh;overflow-y:auto}.mail-folder-pick{display:flex;align-items:center;gap:.5rem;padding:.3rem .4rem;border-radius:var(--dm-radius-md, 6px)}.mail-diag-log{width:100%;height:30vh;margin-top:.5rem;font-family:monospace;font-size:.72rem}.mail-facts{display:flex;flex-direction:column;gap:.2rem;margin-bottom:.75rem}
+#view-container.mail-fullbleed{max-width:none}.mail-layout [hidden],.dm-slideover [hidden]{display:none!important}.mail-reader-summary{display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap}.mail-header-toggle,.mail-extras-toggle{padding:0!important;font-size:.78rem;opacity:.75;text-decoration:underline}.mail-header-toggle:hover,.mail-extras-toggle:hover{opacity:1}.mail-header-details{display:grid;grid-template-columns:max-content 1fr;gap:.15rem .75rem;margin:.5rem 0 0;font-size:.8rem}.mail-header-details dt{opacity:.65}.mail-header-details dd{margin:0;overflow-wrap:anywhere}.mail-layout{display:grid;grid-template-columns:var(--mail-col-1, 190px) auto var(--mail-col-2, 340px) auto 1fr;height:calc(100vh - 140px);min-height:320px;border:1px solid var(--dm-border, #e2e8f0);border-radius:var(--dm-radius-md, 8px);overflow:hidden;background:var(--dm-surface, #fff)}.mail-folders-pane,.mail-list-pane{display:flex;flex-direction:column;border-right:1px solid var(--dm-border, #e2e8f0);min-width:0;min-height:0}.mail-reader-pane{display:flex;flex-direction:column;min-width:0;min-height:0}.mail-pane-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem .75rem;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--dm-text-muted, #64748b);border-bottom:1px solid var(--dm-border, #e2e8f0);flex-shrink:0}.mail-folders-list,.mail-list{overflow-y:auto;flex:1;min-height:0}.mail-search{display:flex;align-items:center;gap:.4rem;padding:.4rem .6rem;border-bottom:1px solid var(--dm-border, #e2e8f0);color:var(--dm-text-muted, #64748b);flex-shrink:0}.mail-search input{flex:1;min-width:0;font-size:.85rem;padding:.25rem .4rem}.mail-search-note{padding:.3rem .6rem;font-size:.74rem;color:var(--dm-text-muted, #64748b);border-bottom:1px solid var(--dm-border, #e2e8f0);flex-shrink:0}.mail-slideover-resizer{padding:0;position:absolute;left:0;top:0;bottom:0;width:6px;cursor:col-resize;z-index:2;background:transparent}.mail-slideover-resizer:hover,.is-resizing>.mail-slideover-resizer{background:var(--dm-primary, #2563eb);opacity:.7}.is-resizing{user-select:none;transition:none!important}.mail-selection{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;padding:.35rem .6rem;font-size:.78rem;background:var(--dm-primary, #2563eb);color:var(--dm-primary-text, #fff);flex-shrink:0}.mail-selection span{flex:1;min-width:0}.mail-selection .btn{color:var(--dm-primary-text, #fff);border:1px solid currentColor;background:transparent}.mail-selection .btn:hover{background:color-mix(in srgb,var(--dm-primary-text, #fff) 15%,transparent)}.mail-item.is-selected{background:var(--dm-active-bg, rgba(15, 23, 42, .07));box-shadow:inset 3px 0 0 var(--dm-primary, #2563eb)}.mail-undo{display:flex;align-items:center;gap:.5rem;padding:.4rem .6rem;font-size:.78rem;background:var(--dm-active-bg, rgba(15, 23, 42, .07));border-bottom:1px solid var(--dm-border, #e2e8f0);flex-shrink:0}.mail-undo span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-splitter{width:5px;cursor:col-resize;background:var(--dm-border, #e2e8f0);flex-shrink:0;background-clip:content-box;border-left:2px solid transparent;border-right:2px solid transparent;box-sizing:content-box}.mail-splitter:hover,.mail-layout.is-resizing .mail-splitter{background-color:var(--dm-primary, #2563eb)}.mail-layout.is-resizing{user-select:none}.mail-layout.is-resizing .mail-folders-pane,.mail-layout.is-resizing .mail-list-pane,.mail-layout.is-resizing .mail-reader-pane,.mail-layout.is-resizing iframe{pointer-events:none}.mail-unread-filter{display:flex;align-items:center;gap:.3rem;font-size:.7rem;text-transform:none;letter-spacing:0;cursor:pointer;margin-left:auto;margin-right:.25rem}.mail-unread-pill{flex-shrink:0;min-width:1.15rem;padding:0 .3rem;border-radius:999px;background:var(--dm-primary, #2563eb);color:var(--dm-primary-text, #fff);font-size:.66rem;font-weight:700;line-height:1.35;text-align:center}.mail-folder.is-context .mail-folder-name{opacity:.6}.mail-account{display:flex;align-items:center;gap:.4rem;width:100%;padding:.45rem .6rem;border:none;background:var(--dm-surface, #fff);cursor:pointer;text-align:left;font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--dm-text-muted, #64748b)}.mail-account:hover{background:var(--dm-hover-bg, rgba(15, 23, 42, .04))}.mail-account.is-active{color:var(--dm-text, #1e293b);position:sticky;top:0;z-index:1;background:var(--dm-surface, #fff)}.mail-account-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-folder{display:flex;align-items:center;gap:.5rem;padding:.45rem .75rem;font-size:.875rem;cursor:pointer;border:none;background:none;width:100%;text-align:left;color:var(--dm-text, #1e293b)}.mail-folder:hover{background:var(--dm-hover-bg, rgba(15, 23, 42, .04))}.mail-folder.is-active{background:var(--dm-active-bg, rgba(15, 23, 42, .07));color:var(--dm-primary, #2563eb);font-weight:600}.mail-folder.is-unselectable{opacity:.6;cursor:default}.mail-folder.is-unselectable:hover{background:none}.mail-folder-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-item{display:block;width:100%;text-align:left;padding:.55rem .75rem;border:none;border-bottom:1px solid var(--dm-border, #e2e8f0);background:none;cursor:pointer;color:var(--dm-text, #1e293b)}.mail-item:hover{background:var(--dm-hover-bg, rgba(15, 23, 42, .04))}.mail-item.is-active{background:var(--dm-active-bg, rgba(15, 23, 42, .07))}.mail-item-top{display:flex;justify-content:space-between;gap:.5rem;align-items:baseline}.mail-item-from{font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-item.is-unread .mail-item-from,.mail-item.is-unread .mail-item-subject{font-weight:700}.mail-item-date{font-size:.72rem;color:var(--dm-text-muted, #64748b);flex-shrink:0}.mail-item-subject{font-size:.82rem;margin-top:.1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-item-meta{display:flex;align-items:center;gap:.35rem;margin-top:.15rem;color:var(--dm-text-muted, #64748b)}.mail-pager{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.4rem .6rem;border-top:1px solid var(--dm-border, #e2e8f0);font-size:.75rem;color:var(--dm-text-muted, #64748b);flex-shrink:0}.mail-reader-head{padding:.75rem 1rem;border-bottom:1px solid var(--dm-border, #e2e8f0);flex-shrink:0}.mail-reader-head:empty{display:none}.mail-reader-subject{font-size:1.05rem;font-weight:600;margin:0 0 .3rem;color:var(--dm-text, #1e293b)}.mail-reader-actions{display:flex;gap:.25rem;margin:.1rem 0 .35rem;flex-wrap:wrap}.mail-reader-meta{font-size:.8rem;color:var(--dm-text-muted, #64748b)}.mail-reader-body{flex:1;position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:0;background:var(--dm-surface, #fff)}.mail-reader-body iframe{width:100%;flex:1;border:none;display:block;background:#fff}.mail-notice{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;padding:.4rem .75rem;font-size:.78rem;background:var(--dm-warning, #8a6d1f);color:var(--dm-warning-text, #fff);border-bottom:1px solid var(--dm-border, #e2e8f0)}.mail-notice .btn{color:var(--dm-warning-text, #fff);border:1px solid currentColor;background:transparent;opacity:.95}.mail-notice .btn:hover{background:color-mix(in srgb,var(--dm-warning-text, #fff) 15%,transparent);opacity:1}.mail-attachments{display:flex;flex-wrap:wrap;gap:.4rem;padding:.5rem .75rem;border-bottom:1px solid var(--dm-border, #e2e8f0);background:var(--dm-background-alt, rgba(15, 23, 42, .03))}.mail-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;height:100%;color:var(--dm-text-muted, #94a3b8);text-align:center;padding:1rem}.mail-empty p{margin:0;font-size:.875rem}@media(max-width:900px){.mail-layout{grid-template-columns:1fr;height:auto!important}.mail-splitter{display:none}.mail-folders-pane,.mail-list-pane{border-right:none;border-bottom:1px solid var(--dm-border, #e2e8f0)}.mail-folders-list,.mail-list{max-height:240px}.mail-reader-body{min-height:60vh}}.mail-box-row{display:flex;align-items:center;gap:.5rem;padding:.5rem .6rem;border:1px solid var(--dm-border, #e2e8f0);border-radius:var(--dm-radius-md, 6px)}.mail-item.is-dragging{opacity:.45}.mail-folder.is-drop-target{background:var(--dm-primary, #2563eb);color:var(--dm-primary-text, #fff);outline:2px solid var(--dm-primary, #2563eb);outline-offset:-2px}.mail-folder.is-drop-target .mail-folder-name,.mail-folder.is-drop-target .mail-unread-pill{color:inherit}.mail-item.is-dragging *{pointer-events:none}.mail-item{position:relative}.mail-item-tick{position:absolute;left:.45rem;top:.55rem;display:inline-flex;opacity:0;color:var(--dm-text-muted, #64748b);transition:opacity .12s ease;padding:2px;margin:-2px;border-radius:var(--dm-radius-sm, 3px)}.mail-item:hover .mail-item-tick,.mail-item:focus-visible .mail-item-tick,.mail-list.is-selecting .mail-item-tick,.mail-item-tick[aria-checked=true]{opacity:1}.mail-item-tick[aria-checked=true]{color:var(--dm-primary, #2563eb)}.mail-item-tick:hover{color:var(--dm-primary, #2563eb);background:var(--dm-hover-bg)}.mail-item-top,.mail-item-subject,.mail-item-meta{padding-left:1.5rem}.mail-select-all{display:inline-flex;align-items:center;margin-right:.1rem;cursor:pointer}.mail-select-all input{cursor:pointer;margin:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mail-item-meta>span{display:inline-flex}.mail-item-meta .is-high{color:var(--dm-danger, #dc2626)}.mail-item-meta .is-low{color:var(--dm-text-muted, #64748b);opacity:.7}.mail-folder.is-hidden-folder .mail-folder-name{opacity:.5;font-style:italic}.mail-thread-chip{display:inline-flex;align-items:center;margin-left:.4rem;padding:0 .35rem;border-radius:999px;font-size:.68rem;font-weight:700;line-height:1.5;color:var(--dm-text-muted, #64748b);background:var(--dm-active-bg, rgba(15, 23, 42, .07));cursor:pointer}.mail-thread-chip:hover{color:var(--dm-primary, #2563eb)}.mail-thread-chip.is-unread{background:var(--dm-primary, #2563eb);color:var(--dm-primary-text, #fff)}.mail-item.is-in-thread{padding-left:1.6rem;box-shadow:inset 3px 0 0 var(--dm-border, #e2e8f0)}.mail-item.is-in-thread .mail-item-from{font-size:.8rem}.mail-pane-head .btn.is-on{color:var(--dm-primary, #2563eb);background:var(--dm-active-bg, rgba(15, 23, 42, .07))}#mail-outbox-btn{font-size:.72rem;font-weight:700}#mail-outbox-btn.is-failed{color:var(--dm-danger, #dc2626)}.mail-attachment{display:inline-flex;align-items:center;border:1px solid var(--dm-border, #e2e8f0);border-radius:var(--dm-radius-md, 6px);overflow:hidden}.mail-attachment .btn{border:none;border-radius:0}.mail-attachment-save{padding-left:.4rem!important;padding-right:.4rem!important;border-left:1px solid var(--dm-border, #e2e8f0)!important;opacity:.7}.mail-attachment-save:hover{opacity:1;color:var(--dm-primary, #2563eb)}.mail-section-heading{margin:1rem 0 .1rem;font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:var(--dm-text-muted, #64748b)}.mail-section-heading:first-child{margin-top:.25rem}.mail-section-form .domma-form{margin:0}.mail-section-form .domma-form-field:last-child{margin-bottom:0}.mail-item-card{margin:0}.mail-item-card .card-header{padding:.5rem .6rem}.mail-item-card .card-body{padding:.6rem}.mail-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.mail-status{min-height:1.2em}.mail-empty-line{margin:.25rem 0}.mail-editor-fallback{min-height:8rem;font-family:inherit;resize:vertical}.mail-clause{display:flex;gap:.3rem;align-items:center;flex-wrap:wrap}.mail-clause .form-select,.mail-clause .form-input{width:auto;flex:0 1 auto}.mail-clause .mail-clause-value{flex:1 1 8rem;min-width:8rem}.mail-section-list{display:flex;flex-direction:column;gap:.5rem}.mail-scroll-sm{max-height:20vh;overflow-y:auto}.mail-scroll-md{max-height:46vh;overflow-y:auto}.mail-section-form .domma-form-field:has(select) .form-label .text-danger{display:none}.mail-compose-form{padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.6rem;height:100%}.mail-compose-body{display:flex;flex-direction:column;flex:1;min-height:0}.mail-compose-editor{flex:1;min-height:0}.mail-compose-textarea{flex:1;min-height:34vh;font-family:inherit;resize:vertical}.mail-attach-list{display:flex;flex-direction:column;gap:.2rem}.mail-template-row{margin:-.15rem 0 .35rem}.mail-template-picker{max-width:16rem}.mail-suggest-row{display:flex;flex-direction:column;line-height:1.25}.mail-suggest-detail{opacity:.7}.mail-rule-off{opacity:.55}.mail-panel{padding:.25rem 0 .5rem}.mail-panel-stack{padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:1rem}.mail-form-stack{padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem}.mail-dialog-stack{display:flex;flex-direction:column;gap:.5rem;padding:.25rem 0}.mail-hint{margin-top:.2rem}.mail-box-sub{overflow:hidden;text-overflow:ellipsis}.mail-add-btn{align-self:flex-start;margin-top:.5rem}.mail-none{margin:0;padding:.5rem .6rem}.mail-kv{padding:.5rem 0;display:flex;flex-direction:column;gap:.35rem}.mail-kv-row{display:flex;gap:.75rem}.mail-kv-key{min-width:8.5rem;flex-shrink:0}.mail-toggle-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.mail-sender-list{display:flex;flex-direction:column;gap:.2rem;max-height:40vh;overflow-y:auto}.mail-folder-pick{display:flex;align-items:center;gap:.5rem;padding:.3rem .4rem;border-radius:var(--dm-radius-md, 6px)}.mail-diag-log{width:100%;height:30vh;margin-top:.5rem;font-family:monospace;font-size:.72rem}.mail-facts{display:flex;flex-direction:column;gap:.2rem;margin-bottom:.75rem}.mail-item-more{position:absolute;right:.4rem;bottom:.35rem;display:inline-flex;align-items:center;justify-content:center;min-width:1.4rem;height:1.4rem;border-radius:var(--dm-radius-sm, 3px);font-size:1rem;line-height:1;color:var(--dm-text-muted, #64748b);background:inherit;opacity:0;transition:opacity .12s ease}.mail-item:hover .mail-item-more,.mail-item:focus-visible .mail-item-more,.mail-item.is-active .mail-item-more{opacity:1}.mail-item-more:hover{color:var(--dm-primary, #2563eb)}.mail-section-intro{display:flex;align-items:center;gap:.35rem;margin:0 0 .75rem;padding-bottom:.5rem;border-bottom:1px solid var(--dm-border, #e2e8f0)}

package/plugins/_lib/admin/mail/mail.html

@@ -33,7 +33,7 @@
           <span data-icon="clock" data-icon-size="14"></span><span id="mail-outbox-count"></span>
         </button>
         <button class="btn btn-sm btn-ghost" id="mail-threads-btn" title="Group messages into conversations" aria-pressed="false" hidden>
-          <span data-icon="messages-square" data-icon-size="14"></span>
+          <span data-icon="message-square" data-icon-size="14"></span>
         </button>
         <button class="btn btn-sm btn-ghost" id="mail-compose-btn" title="New message" hidden>
           <span data-icon="edit-3" data-icon-size="14"></span>