/* Mail Hall mailbox, reader, compose and notification styles */
.block { display:block; }
.input-sm { padding:8px 12px;font-size:.82rem;width:auto;min-width:0; }
.link-btn { background:none;border:0;color:#2368c4;font:600 .82rem var(--font);cursor:pointer;padding:4px 6px;border-radius:6px; }
.link-btn:hover { background:#eaf2fe; }
.inline-form { display:flex;gap:10px;align-items:center;flex-wrap:wrap; }
.inline-form .input { flex:1;min-width:180px; }

/* Header */
.header-actions { display:flex;align-items:center;gap:10px; }
.bell { position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#ffffff10;border:1px solid var(--border);font-size:1.1rem; }
.bell:hover { background:#ffffff22; }
.count-badge { position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#ff3b5c;color:#fff;font:700 .68rem/20px var(--font);text-align:center; }
.rail-count { min-width:18px;padding:1px 5px;border-radius:9px;background:#ff3b5c;color:#fff;font:700 .62rem/1.4 var(--font); }
.hv-mail { display:flex;flex-direction:column;gap:10px;justify-content:center; }
.hv-mail-row { display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:#ffffff12;border:1px solid #ffffff14; }
.hv-mail-row i { display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--grad);font:700 .75rem var(--font-d);font-style:normal;flex-shrink:0; }
.hv-mail-row span { display:flex;flex-direction:column;flex:1;min-width:0;font-size:.85rem; }
.hv-mail-row small { color:#b5cbe6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.hv-mail-row em { font-style:normal;color:#ffd27a; }
.hv-mail-row.unread { background:#2c6fc244;border-color:#83c6ff55; }
.hv-mail-row.unread b::before { content:'';display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:50%;background:#4ff0b8; }

/* Toasts */
.toast-stack { position:fixed;right:20px;bottom:20px;z-index:10002;display:flex;flex-direction:column;gap:10px;width:min(360px,calc(100vw - 40px)); }
.toast { display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:14px;background:#0b2852;color:#eef5ff;border:1px solid #2c6fc2;box-shadow:0 18px 40px -18px #000a;animation:slideDown .3s ease;font-size:.86rem; }
.toast b { display:block;margin-bottom:2px; }
.toast a { color:inherit; }
.toast .toast-body { flex:1;min-width:0;overflow-wrap:anywhere; }
.toast button { background:none;border:0;color:#b9cde8;cursor:pointer;font-size:1.1rem;line-height:1; }
.toast-error { background:#5d1a2c;border-color:#c8486a; }
.toast-success { background:#0f4a34;border-color:#2fa678; }
.toast-security { border-color:#ffc24b; }

/* Light workspace badges */
.workspace-content .badge-success { background:#d5f3e5;color:#16623f; }
.workspace-content .badge-pending { background:#fff2d6;color:#7a5200; }
.workspace-content .badge-failed { background:#ffe3e9;color:#9b1f3c; }

/* Mailbox shell */
.mail-shell { display:grid;grid-template-columns:220px minmax(0,1fr);gap:26px;align-items:start; }
.mail-sidebar { position:sticky;top:calc(var(--header-height) + 16px);display:flex;flex-direction:column;gap:8px; }
.compose-btn { margin-bottom:8px; }
.folder-nav { display:flex;flex-direction:column;gap:2px; }
.folder-link { display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;color:#244564;font-size:.88rem;font-weight:500; }
.folder-link > span { width:22px;text-align:center; }
.folder-link:hover { background:#e1ecfa; }
.folder-link.selected { background:#d6e7fc;color:#0f3f7a;font-weight:700; }
.folder-count { margin-left:auto;font-size:.72rem;padding:1px 8px;border-radius:10px;background:#2368c4;color:#fff; }
.folder-title { margin:14px 12px 4px;font:700 .7rem var(--font);letter-spacing:1px;text-transform:uppercase;color:#6a83a0; }
.folder-create summary { cursor:pointer;padding:8px 12px;font-size:.84rem;color:#2368c4;font-weight:600; }
.folder-create form { display:flex;gap:6px;padding:4px 6px; }
.folder-create .input { padding:8px 10px;font-size:.82rem; }
.mail-main { min-width:0; }
.mail-main .view-heading { margin-bottom:18px; }
.sort-form { gap:8px; }
.folder-manage,.advanced-search { padding:16px 20px;margin-bottom:16px; }
.folder-manage summary,.advanced-search summary { cursor:pointer;font-weight:700;color:#17457b; }
.folder-manage[open] summary,.advanced-search[open] summary { margin-bottom:14px; }
.folder-manage form { margin-top:10px; }
.search-grid { grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;margin-bottom:16px; }
.check-row { display:flex;gap:18px;align-items:flex-end;flex-wrap:wrap;padding-bottom:10px; }
.draft-search { display:flex;gap:8px;margin-bottom:12px;max-width:480px; }

/* Mail list */
.mail-list-form { background:#fff;border:1px solid #d9e4f2;border-radius:16px;box-shadow:0 10px 26px -22px #143b6b66;overflow:hidden; }
.mail-toolbar { display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 14px;border-bottom:1px solid #e1eaf5;background:#f6f9fe; }
.mail-toolbar .btn[disabled] { opacity:.45;cursor:not-allowed; }
.select-all { font-size:.82rem;margin-right:6px; }
.move-group { display:inline-flex;gap:6px;align-items:center; }
.refresh-btn { margin-left:auto; }
.mail-list { min-height:120px; }
.mail-list.refreshing { opacity:.6;transition:opacity .2s; }
.mail-empty { margin:20px;border-color:#cddff4;color:#637c99; }
.mail-row { display:flex;align-items:center;gap:6px;padding:0 12px;border-bottom:1px solid #edf2f9;background:#f9fbfe;color:#4a6481;transition:background .15s; }
.mail-row:hover { background:#eef5ff; }
.mail-row.unread { background:#fff;color:#0f2c4f; }
.mail-row.unread .mail-from,.mail-row.unread .mail-summary b { font-weight:800; }
.mail-row.unread { box-shadow:inset 3px 0 #287eef; }
.mail-row.selected { background:#e3eefc; }
.mail-check { display:grid;place-items:center;width:30px;height:44px;cursor:pointer; }
.mail-check input { width:17px;height:17px;accent-color:#287eef; }
.star-btn { background:none;border:0;cursor:pointer;font-size:1.15rem;color:#9fb3cb;width:30px;padding:0; }
.star-btn:hover,.mail-row.starred .star-btn { color:#e9a908; }
.mail-row-link { flex:1;min-width:0;display:grid;grid-template-columns:minmax(120px,210px) minmax(0,1fr) auto 92px;gap:14px;align-items:center;padding:13px 4px;color:inherit; }
.mail-from { overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:600; }
.mail-from-email { display:block;font-size:.72rem;font-weight:400;color:#6a83a0;overflow:hidden;text-overflow:ellipsis; }
.thread-count { display:inline-block;padding:0 7px;border-radius:9px;background:#e5effc;color:#235a9c;font-size:.72rem;font-weight:700; }
.mail-summary { overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:.9rem; }
.mail-summary b { font-weight:600; }
.mail-preview { color:#6a83a0;font-weight:400; }
.mail-flags { display:flex;gap:6px;align-items:center; }
.attach-flag { font-size:1rem; }
.folder-tag { display:inline-block;padding:2px 9px;border-radius:8px;background:#eaf2fe;color:#235a9c;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.4px; }
.mail-row time { text-align:right;font-size:.8rem;white-space:nowrap; }
.mail-row.unread time { font-weight:700;color:#17457b; }
.draft-mark { color:#c2410c;font-size:.75rem;font-weight:800;text-transform:uppercase;width:44px; }
.pager { display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:12px 16px;font-size:.82rem;color:#526c88; }
.pager span { margin-right:auto; }

/* Reader */
.read-toolbar { border:1px solid #d9e4f2;border-radius:14px;margin-bottom:18px; }
.thread-head { margin-bottom:16px; }
.thread-head h1 { margin:0 0 8px;overflow-wrap:anywhere; }
.thread-head .thread-count { padding:3px 10px; }
.thread-message { background:#fff;border:1px solid #d9e4f2;border-radius:16px;margin-bottom:12px;box-shadow:0 8px 22px -20px #143b6b66; }
.message-head { display:flex;align-items:center;gap:12px;padding:16px 20px;cursor:pointer;list-style:none; }
.message-head::-webkit-details-marker { display:none; }
.message-who { flex:1;min-width:0;display:flex;flex-direction:column; }
.message-who b { overflow-wrap:anywhere; }
.message-who small { color:#6a83a0;overflow-wrap:anywhere; }
.message-snippet { color:#6a83a0;font-size:.84rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.thread-message[open] .message-snippet { display:none; }
.message-meta { font-size:.8rem;color:#526c88;white-space:nowrap;text-align:right; }
.message-detail { padding:0 20px 20px 74px; }
.address-lines { display:grid;grid-template-columns:auto 1fr;gap:4px 10px;font-size:.82rem;color:#526c88;margin:0 0 16px; }
.address-lines dt { font-weight:700; }
.address-lines dd { margin:0;overflow-wrap:anywhere; }
.addr { color:#17457b; }
.mail-body { color:#1b3554;line-height:1.65;overflow-wrap:anywhere;font-size:.95rem; }
.mail-body a { color:#1d64c4;text-decoration:underline; }
.mail-body ul,.mail-body ol { padding-left:26px;margin:8px 0; }
.mail-body ul { list-style:disc; }
.mail-body ol { list-style:decimal; }
.mail-body p,.mail-body div { margin:0 0 6px; }
.mail-body blockquote { margin:12px 0;padding:4px 0 4px 14px;border-left:3px solid #cddff4;color:#526c88; }
.attachment-list { display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0; }
.attachment-chip { display:flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid #cddff4;border-radius:12px;background:#f6f9fe;color:#17457b;font-size:.84rem;max-width:100%; }
.attachment-chip:hover { background:#e5effc; }
.attachment-chip small { color:#6a83a0; }
.message-actions { display:flex;gap:8px;flex-wrap:wrap;margin-top:20px; }
.message-actions form { display:inline; }
.delivery-status { margin-top:18px; }
.delivery-status summary { cursor:pointer;font-weight:700;color:#17457b;margin-bottom:10px; }

/* Compose */
.compose-layout { max-width:1080px; }
.compose-panel { padding:22px 26px; }
.compose-restore,.compose-conflict { display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 16px;border-radius:12px;margin-bottom:14px;font-size:.86rem; }
.compose-restore { background:#eaf3ff;border:1px solid #b9d6f7;color:#225793; }
.compose-conflict { background:#fff6e5;border:1px solid #f3cf87;color:#7a5200; }
.compose-restore span,.compose-conflict span { flex:1;min-width:200px; }
.recipient-row { display:flex;align-items:flex-start;gap:12px;padding:8px 0;border-bottom:1px solid #e6eef8; }
.recipient-label { width:64px;flex-shrink:0;padding-top:10px;font-weight:700;font-size:.84rem;color:#244564; }
.token-field { position:relative;flex:1;min-width:0;display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:4px 0; }
.tokens { display:contents; }
.token { display:inline-flex;align-items:center;gap:6px;padding:4px 6px 4px 11px;border-radius:16px;background:#e5effc;color:#17457b;font-size:.82rem;max-width:100%; }
.token span { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.token.group,.token.department { background:#e2f4ec;color:#16623f; }
.token.invalid { background:#ffe3e9;color:#9b1f3c;text-decoration:line-through wavy #c8486a; }
.token button { background:none;border:0;cursor:pointer;color:inherit;font-size:1rem;line-height:1;padding:0 3px; }
.token-input { flex:1;min-width:180px;border:0;background:transparent;padding:8px 2px;font:inherit;font-size:.9rem;color:#153253;outline:none; }
.suggestions { position:absolute;left:0;right:0;top:100%;z-index:30;background:#fff;border:1px solid #cddff4;border-radius:12px;box-shadow:0 18px 40px -18px #143b6b88;max-height:300px;overflow:auto;padding:6px; }
.suggestions li { display:flex;flex-direction:column;padding:8px 12px;border-radius:8px;cursor:pointer;font-size:.86rem; }
.suggestions li small { color:#6a83a0; }
.suggestions li.active,.suggestions li:hover { background:#e5effc; }
.recipient-tools { display:flex;gap:4px;align-items:center;padding-top:4px; }
.subject-input { border:0;background:transparent !important;padding:10px 2px;font-size:1rem;font-weight:600; }
.subject-input:focus { box-shadow:none; }
.editor-toolbar { display:flex;flex-wrap:wrap;gap:4px;align-items:center;padding:10px 0;border-bottom:1px solid #e6eef8; }
.editor-toolbar button { min-width:34px;padding:6px 10px;border-radius:8px;border:1px solid #d9e4f2;background:#f6f9fe;color:#17457b;cursor:pointer;font:600 .82rem var(--font); }
.editor-toolbar button:hover,.editor-toolbar button.active { background:#d6e7fc; }
.editor-toolbar .sep { width:1px;height:22px;background:#d9e4f2;margin:0 4px; }
.editor { min-height:300px;max-height:60vh;overflow:auto;padding:16px 4px;outline:none; }
.editor:empty::before { content:'Write your message…';color:#9fb3cb; }
.attachments-box { display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:14px 0;border-top:1px solid #e6eef8; }
.attachment-edit-list { width:100%;display:flex;flex-wrap:wrap;gap:8px; }
.attachment-edit-list li { display:flex;align-items:center;gap:8px;padding:8px 10px 8px 14px;border:1px solid #cddff4;border-radius:12px;background:#f6f9fe;font-size:.82rem;color:#17457b; }
.attachment-edit-list li small { color:#6a83a0; }
.attachment-edit-list li.uploading { opacity:.6; }
.attachment-edit-list li.failed { border-color:#f2bac8;background:#fff0f3;color:#922a43; }
.attachment-edit-list button { background:none;border:0;cursor:pointer;color:inherit;font-size:1rem; }
.compose-actions { display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-top:16px;border-top:1px solid #e6eef8; }
.save-status { margin-left:auto;font-size:.8rem;color:#6a83a0; }
.save-status.saving { color:#225793; }
.save-status.ok { color:#186445; }
.save-status.error { color:#b62346;font-weight:700; }

/* Directory picker dialog */
.picker { width:min(720px,94vw);max-height:86vh;padding:0;border:0;border-radius:20px;box-shadow:0 30px 80px -20px #0009;color:#153253; }
.picker::backdrop { background:#081d3fa6; }
.picker-inner { display:flex;flex-direction:column;max-height:86vh; }
.picker-head { display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border-bottom:1px solid #e1eaf5; }
.picker-head h2 { margin:0;font-size:1.2rem; }
.picker-head .link-btn { font-size:1.5rem; }
.picker-filters { display:flex;gap:10px;padding:14px 22px; }
.picker-filters .input { color:#153253;background:#f8fbff; }
.picker-filters select { max-width:200px; }
.picker-results { flex:1;overflow:auto;padding:0 22px;min-height:200px; }
.picker-results h3 { font-size:.72rem;letter-spacing:1px;text-transform:uppercase;color:#6a83a0;margin:12px 0 6px; }
.picker-results label { display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:10px;cursor:pointer;font-size:.86rem; }
.picker-results label:hover { background:#eef5ff; }
.picker-results label small { display:block;color:#6a83a0; }
.picker-results input { width:17px;height:17px;accent-color:#287eef; }
.picker-foot { display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:14px 22px;border-top:1px solid #e1eaf5;font-size:.84rem; }
.picker-foot span { margin-right:auto;color:#526c88; }
.picker .btn { background:#e5effc;color:#17457b;border-color:#cddff4; }

/* Directory, contacts, notifications, settings and admin */
.directory-filters { display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;align-items:end;margin-bottom:18px; }
.directory-toolbar { display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px; }
.person-card.inactive { opacity:.6; }
.person-card.selected { border-color:#287eef;box-shadow:0 6px 0 #c6dcf7; }
.person-select { margin-left:auto; }
.person-facts { display:grid;gap:4px;margin:0 0 14px;font-size:.82rem;color:#526c88; }
.person-facts span { overflow-wrap:anywhere; }
.profile-head { display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin-bottom:22px; }
.profile-head h1 { margin:0; }
.detail-list { display:grid;grid-template-columns:max-content 1fr;gap:10px 22px;margin:0; }
.detail-list dt { font-weight:700;color:#244564;font-size:.86rem; }
.detail-list dd { margin:0;overflow-wrap:anywhere; }
.frequent-strip { display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px; }
.frequent-strip a { display:inline-flex;align-items:center;gap:8px;padding:5px 12px 5px 5px;border-radius:30px;background:#fff;border:1px solid #d9e4f2;font-size:.84rem;color:#17457b; }
.notification-list { display:flex;flex-direction:column;gap:10px; }
.notification-item { display:flex;gap:14px;align-items:flex-start;padding:16px 18px;background:#fff;border:1px solid #d9e4f2;border-radius:14px; }
.notification-item.unread { border-left:4px solid #287eef;background:#fbfdff; }
.notification-item .ic { font-size:1.3rem; }
.notification-item .body { flex:1;min-width:0; }
.notification-item p { margin:4px 0 0;color:#526c88;font-size:.86rem;overflow-wrap:anywhere; }
.notification-item time { font-size:.78rem;color:#6a83a0;white-space:nowrap; }
.settings-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:22px;align-items:start; }
.settings-grid .panel h2 { margin-top:0; }
.admin-tabs { display:flex;gap:6px;flex-wrap:wrap;margin-bottom:20px; }
.admin-tabs a { padding:9px 16px;border-radius:10px;background:#fff;border:1px solid #d9e4f2;font-weight:600;font-size:.86rem;color:#17457b; }
.admin-tabs a.active { background:var(--grad);color:#fff;border-color:transparent; }
.tbl-actions { display:flex;gap:6px;flex-wrap:wrap; }
.tbl-actions form { display:inline; }
.workspace-content .tbl td small { color:#6a83a0; }

@media(max-width:1100px) {
    .split-grid { grid-template-columns:minmax(0,1fr); }
    .mail-shell { grid-template-columns:180px minmax(0,1fr);gap:18px; }
    .mail-row-link { grid-template-columns:minmax(100px,160px) minmax(0,1fr) auto 70px;gap:10px; }
    .message-detail { padding-left:20px; }
    .directory-filters { grid-template-columns:1fr 1fr; }
}
@media(max-width:760px) {
    .header-actions { gap:6px; }
    .bell { width:36px;height:36px; }
    .mail-shell { grid-template-columns:minmax(0,1fr); }
    .mail-sidebar { position:static;flex-direction:row;flex-wrap:wrap;align-items:center;min-width:0; }
    .compose-btn { width:auto;margin:0; }
    .folder-nav { flex-direction:row;flex-wrap:nowrap;overflow-x:auto;gap:4px;width:100%; }
    .folder-link { white-space:nowrap;padding:7px 10px;font-size:.8rem; }
    .folder-title { display:none; }
    .mail-toolbar { gap:6px; }
    .mail-toolbar .btn { padding:6px 9px;font-size:.74rem; }
    .select-all span { display:none; }
    .mail-row { padding:0 6px;align-items:flex-start; }
    .mail-check,.star-btn { height:auto;padding-top:14px; }
    .mail-row-link { grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"from time" "summary flags";gap:2px 8px;padding:10px 2px; }
    .mail-from { grid-area:from; }
    .mail-summary { grid-area:summary; }
    .mail-flags { grid-area:flags; }
    .mail-row time { grid-area:time;font-size:.74rem; }
    .mail-preview,.mail-from-email { display:none; }
    .draft-mark { width:auto;padding-top:14px; }
    .message-head { padding:14px; }
    .message-snippet,.message-head .avatar { display:none; }
    .message-detail { padding:0 14px 16px; }
    .compose-panel { padding:16px; }
    .recipient-row { flex-wrap:wrap;gap:4px; }
    .recipient-label { width:auto;padding-top:0; }
    .token-field { flex-basis:100%; }
    .editor { min-height:220px; }
    .save-status { margin-left:0;width:100%; }
    .picker-filters { flex-direction:column; }
    .picker-filters select { max-width:none; }
    .directory-filters { grid-template-columns:1fr; }
    .detail-list { grid-template-columns:1fr; }
    .toast-stack { right:10px;bottom:10px;width:calc(100vw - 20px); }
}