/* Mail Dashboard Sync CSS - Dua tren SEO Dashboard UI. Version: 36.21.18. Logic: Giao dien chuan he thong. */
@font-face{font-family:"SVN-Gilroy Bold";src:url("../../fonts/SVN-GilroyBold.woff2") format("woff2"),url("../../fonts/SVN-GilroyBold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:"Inter";src:url("../../fonts/Inter-Regular.woff2") format("woff2"),url("../../fonts/Inter-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap;}
body.mail-app-mode,
body.mail-app-mode .seo-app { font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
body.mail-app-mode .seo-header,
body.mail-app-mode .seo-sidebar,
body.mail-app-mode .wm-stack-header,
body.mail-app-mode .wm-stack-item-head,
body.mail-app-mode .wm-stack-footer { font-synthesis-weight:auto; }
body.mail-app-mode .seo-header .user-display-name { font-weight:600; }
body.mail-app-mode .seo-header .user-role { font-weight:400; }
body.mail-app-mode #btnToggleRead,
body.mail-app-mode #btnDeleteMsg { display:none!important; }
.mail-app-mode .seo-app { background:var(--bg-subtle); }
/* ANIMATIONS */
@keyframes pulse-skeleton { 0% { opacity:0.5; } 50% { opacity:1; } 100% { opacity:0.5; } }
@keyframes shimmer-move { 0% { transform:translateX(-100%); } 100% { transform:translateX(100%); } }
@keyframes dropdownFadeIn { from { opacity:0;transform:translateY(-10px) scale(0.95); } to { opacity:1;transform:translateY(0) scale(1); } }
/* BUTTONS */
.mail-app-mode .btn-primary, .btn-compose-mail-new { position:relative;overflow:hidden;background:var(--vibe-gradient)!important;color:white!important;border:none!important;transition:all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)!important;box-shadow:0 2px 8px rgba(108,46,231,0.16); }
.mail-app-mode .btn-primary { animation:none; }
.mail-app-mode .btn-primary.btn-pulse, .btn-compose-mail-new { animation:pulse-purple 2.4s infinite; }
.mail-app-mode .btn-primary::before, .btn-compose-mail-new::before { display:block;pointer-events:none; }
.btn-compose-mail-new::before { content:"";position:absolute;top:0;left:-100%;width:75%;height:100%;background:linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0) 100%);transform:skewX(-25deg);transition:left 0.75s ease-in-out; }
.btn-compose-mail-new:hover::before { left:120%; }
.mail-app-mode .btn-primary:hover, .btn-compose-mail-new:hover { color:#fff!important;transform:translateY(-1px)!important;box-shadow:0 5px 14px rgba(108,46,231,0.24)!important;filter:brightness(1.04)!important; }
.mail-app-mode .btn-primary:active, .btn-compose-mail-new:active { transform:none!important;box-shadow:0 1px 5px rgba(108,46,231,0.18)!important; }
.mail-app-mode .btn-secondary,
.mail-app-mode .btn-ghost { background:var(--bg-body)!important;border:1px solid var(--border)!important;color:var(--primary)!important;box-shadow:none!important;text-decoration:none!important;display:inline-flex;align-items:center;justify-content:center;gap:8px; }
.mail-app-mode .btn-secondary:hover,
.mail-app-mode .btn-ghost:hover { background:var(--bg-subtle)!important;border-color:#bfdbfe!important;color:var(--primary)!important;transform:none!important;box-shadow:0 4px 12px rgba(15,23,42,.06)!important; }
.btn-compose-mail-new { width:100%;padding:14px;border-radius:50px!important;font-weight:800;font-family:"SVN-Gilroy Bold",sans-serif;display:flex;align-items:center;justify-content:center;gap:12px;cursor:pointer;font-size:0.95rem; }
.btn-compose-mail-new svg { width:20px;height:20px; }
#btnSyncIMAP svg.fa-spin { animation:spin .8s linear infinite; }
/* wm-btn-circle: inherits from email.css (36px, bg:#f1f5f9, no border) */
.btn-floating-send { position:fixed;bottom:40px;right:40px;width:60px;height:60px;border-radius:50%;background:var(--accent);color:white;border:none;box-shadow:0 10px 25px rgba(237,9,164,0.4);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.3s cubic-bezier(0.175,0.885,0.32,1.275);z-index:999; }
.btn-floating-send:hover { transform:scale(1.1) translateY(-5px);box-shadow:0 15px 35px rgba(237,9,164,0.55);filter:brightness(1.1); }
.btn-floating-send svg { width:24px;height:24px;stroke:white;margin:0!important; }
/* SHIMMERS & BADGES */
.loading-shimmer { background:var(--bg-subtle);position:relative;overflow:hidden;border-radius:8px; }
.loading-shimmer::after { content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.4),transparent);animation:shimmer-move 2s infinite; }
.badge-count { background:var(--accent);color:white;font-size:11px;font-weight:800;padding:3px 10px;border-radius:50px;margin-left:auto;box-shadow:none; }
.mail-app-mode .seo-sidebar .wm-badge { margin-left:auto;min-width:24px;height:24px;padding:0 8px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font:800 0.72rem/1 "Inter",sans-serif;letter-spacing:0;box-shadow:none; }
.mail-app-mode .is-hidden,
.mail-app-mode .wm-badge.is-hidden,
.mail-app-mode .wm-title-unread-badge.is-hidden { display:none!important; }
.mail-app-mode .btn .btn-spinner,
.mail-app-mode button .btn-spinner { width:18px;height:18px;margin:0 8px 0 0;border-width:2px;box-sizing:border-box;display:inline-block;vertical-align:middle;align-self:center;flex:0 0 18px; }
.mail-app-mode .btn-auth .btn-spinner { margin:0; }
.mail-app-mode .btn-loading-text { display:inline-flex;align-items:center;line-height:1.2;min-height:18px; }
.mail-spinner-icon { width:16px;height:16px;margin:0 8px 0 0;display:inline-block;vertical-align:middle;position:relative;top:1px;flex:0 0 16px; }
.mail-spinner-icon:only-child { margin:0!important;top:0; }
.mail-app-mode .btn .mail-spinner-icon,
.mail-app-mode button .mail-spinner-icon { align-self:center; }
.mail-app-mode .seo-sidebar .badge-danger { background:var(--danger);color:#fff; }
.mail-app-mode .seo-sidebar .badge-info { background:#0ea5e9;color:#fff; }
.mail-app-mode .seo-sidebar .badge-warning { background:#f59e0b;color:#fff; }
.mail-app-mode .seo-sidebar .badge-secondary { background:var(--text-light);color:#fff; }
.mail-app-mode .seo-sidebar .menu-item.active .wm-badge { box-shadow:none; }
.mail-app-mode .seo-sidebar .menu-item {
  font-weight:600;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)!important;
}
.mail-app-mode .seo-sidebar .menu-item:hover {
  background:var(--bg-subtle)!important;
  color:var(--primary)!important;
  transform:none!important;
  box-shadow:none!important;
}
.mail-app-mode .seo-sidebar .menu-item.active {
  background:var(--primary-bg)!important;
  color:var(--primary)!important;
  box-shadow:none!important;
  transform: none!important;
}
/* AVATAR & DROPDOWN */
.acc-avatar-wrapper { position:relative;width:38px;height:38px;flex-shrink:0;border-radius:50%;overflow:hidden;background:var(--text-light); }
.acc-avatar-ui-v2 { position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;color:white;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;line-height:1;letter-spacing:0; }
.acc-avatar-img { position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;object-fit:cover;background:var(--bg-body);border:1px solid rgba(0,0,0,0.05); }
.mail-app-mode .user-dropdown-trigger .mail-header-avatar { width:40px;height:40px;border:2px solid var(--bg-body);border-radius:50%;background:var(--bg-body);box-shadow:0 2px 10px rgba(0,0,0,.1);overflow:hidden;transition:none; }
.mail-app-mode .user-dropdown-trigger .mail-header-avatar .acc-avatar-ui-v2,
.mail-app-mode .user-dropdown-trigger .mail-header-avatar .acc-avatar-img { border:0; }
.mail-app-mode .wm-avatar-wrapper { border:1px solid rgba(15,23,42,.06);background:var(--text-light);color:#fff;box-shadow:0 2px 10px rgba(15,23,42,.08); }
.mail-app-mode .wm-avatar-letter { color:inherit;line-height:1;letter-spacing:0; }
.mail-app-mode .wm-avatar-img { border-radius:50%;background:var(--bg-body); }
/* Old dropdown CSS removed — now using hover-based pattern from .mail-app-mode block below (synced from SEO Dashboard) */
/* listTitle font upgrade */
.mail-app-mode .wm-list-title { font-size:1.35rem;font-family:"SVN-Gilroy Bold",sans-serif;font-weight:800;color:var(--text-main); }
.mail-app-mode .wm-title-unread-badge { margin-left:6px;color:var(--danger);font:800 1rem "Inter",sans-serif;letter-spacing:0; }
.mail-app-mode .wm-linked-pill { display:inline-flex;align-items:center;max-width:240px;padding:4px 10px;border-radius:999px;background:var(--primary-bg);color:var(--primary);font:700 0.82rem/1.2 "Inter",sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.mail-app-mode .wm-settings-email { display:inline-block;max-width:280px;color:var(--text-main);font:800 0.92rem/1.3 "Inter",sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.mail-app-mode .wm-linked-email { max-width:420px;height:40px;border-radius:12px;border:1px solid var(--border);background:var(--bg-body);font:600 0.9rem/1.3 "Inter",sans-serif; }
.mail-app-mode .wm-settings-table td { vertical-align:middle;padding:12px 16px;border-bottom:1px solid var(--border); }
.mail-app-mode .wm-switch-inline { display:inline-flex;margin:0; }
.mail-app-mode .wm-settings-panel { flex:1;min-height:0;overflow:auto;padding:24px;background:var(--bg-body); }
.mail-app-mode .wm-settings-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:16px;align-content:start; }
.mail-app-mode .wm-settings-card { min-width:0;padding:18px;border:1px solid var(--border);border-radius:14px;background:var(--bg-body);display:flex;align-items:center;justify-content:space-between;gap:18px;box-shadow:0 8px 24px rgba(13,62,154,.05); }
.mail-app-mode .wm-settings-card-main { min-width:0;display:flex;align-items:center;gap:14px;flex:1; }
.mail-app-mode .wm-settings-card-avatar, .mail-app-mode .wm-settings-card-avatar .acc-avatar-wrapper { width:44px;height:44px; }
.mail-app-mode .wm-settings-avatar-skeleton { width:44px;height:44px;border-radius:50%;flex:0 0 44px; }
.mail-app-mode .wm-settings-card-text { min-width:0;display:grid;gap:5px;flex:1; }
.mail-app-mode .wm-settings-card-title { min-width:0;color:var(--primary);font:800 .98rem/1.25 "Inter",sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.mail-app-mode .wm-settings-card .wm-settings-email { max-width:100%;color:var(--text-light);font:700 .82rem/1.3 "Inter",sans-serif; }
.mail-app-mode .wm-settings-field { margin-top:8px;display:grid;gap:6px; }
.mail-app-mode .wm-settings-field span, .mail-app-mode .wm-settings-toggle > span { color:var(--text-light);font:800 .74rem/1.2 "Inter",sans-serif;text-transform:uppercase;letter-spacing:.03em; }
.mail-app-mode .wm-settings-field .wm-linked-email { max-width:100%;height:42px;padding:0 12px; }
.mail-app-mode .wm-settings-toggle { flex:0 0 auto;display:grid;justify-items:end;gap:9px; }
.mail-app-mode .wm-settings-card-loading { min-height:118px; }
.mail-app-mode .wm-header-bar-list { position:relative;display:grid;grid-template-columns:minmax(180px,1fr) auto;align-items:center;gap:14px; }
.mail-app-mode .wm-list-title { min-width:0;margin:0; }
.mail-app-mode .wm-list-tools { grid-column:2;justify-self:end; }
.mail-app-mode .wm-bulk-actions { position:absolute;left:50%;top:50%;z-index:2;display:none;align-items:center;justify-content:center;gap:8px;min-width:0;transform:translate(-50%,-50%); }
.mail-app-mode .wm-bulk-actions.show { display:flex; }
.mail-app-mode .wm-bulk-count { height:36px;padding:0 12px;border-radius:999px;background:var(--primary-bg);color:var(--primary);display:inline-flex;align-items:center;gap:4px;font-family:"Inter",sans-serif;font-size:0.82rem;font-weight:800;white-space:nowrap; }
/* wm-icon-action inherits core premium scaling and round design from style.css */
.mail-app-mode .wm-icon-action svg { flex-shrink:0;margin:0!important; }
.mail-app-mode .wm-icon-action:disabled { opacity:0.65;cursor:not-allowed;transform:none!important; }
.mail-app-mode .wm-icon-action-muted { border-color:var(--border);color:var(--text-body);background:var(--bg-subtle); }
.mail-app-mode .wm-icon-action-muted:hover { border-color:var(--border);color:var(--primary);background:var(--bg-subtle); }
.mail-app-mode .wm-icon-action-reply { border-color:var(--primary-border);color:var(--primary);background:var(--primary-bg); }
.mail-app-mode .wm-icon-action-reply:hover { border-color:var(--primary);color:#fff!important;background:var(--primary);box-shadow:0 4px 12px rgba(13,62,154,0.12); }
.mail-app-mode .wm-icon-action-restore { border-color:var(--success-border);color:var(--success);background:var(--success-bg); }
.mail-app-mode .wm-icon-action-restore:hover { border-color:var(--success);color:#fff!important;background:var(--success);box-shadow:0 4px 12px rgba(22,163,74,0.12); }
.mail-app-mode .wm-icon-action-danger { border-color:var(--danger-border);color:var(--danger);background:var(--danger-bg); }
.mail-app-mode .wm-icon-action-danger:hover { border-color:var(--danger);color:#fff!important;background:var(--danger);box-shadow:0 4px 12px rgba(239,68,68,0.15); }
.mail-app-mode .mail-account-delete-btn { border-color:#fecaca!important;background:#fff7f7!important;color:#b42318!important; }
.mail-app-mode .mail-account-delete-btn:hover { border-color:#fca5a5!important;background:#fff1f1!important;color:#991b1b!important;box-shadow:0 4px 12px rgba(185,28,28,0.10);transform:none!important; }
.mail-app-mode .mail-account-delete-btn svg { stroke:currentColor; }
html[data-theme="dark"] body.mail-app-mode .btn-action-circle.mail-account-delete-btn { border-color:#7f1d1d!important;background:#3b1f24!important;color:#fca5a5!important; }
html[data-theme="dark"] body.mail-app-mode .btn-action-circle.mail-account-delete-btn:hover { border-color:#991b1b!important;background:#4a2028!important;color:#fecaca!important; }
/* MAIL CARDS */
.mail-list-box-new, .mail-reader-card-new, .mail-form-card, .mail-table-card, .mail-automation-card { background:rgba(255, 255, 255, 0.92)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:24px!important;border:1px solid rgba(255, 255, 255, 0.6)!important;box-shadow:0 16px 40px rgba(13, 62, 154, 0.08), 0 4px 12px rgba(13, 62, 154, 0.03)!important;overflow:hidden;transition:all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); }
.mail-reader-card-new { padding:32px;min-height:600px; }
.mail-form-card { padding:32px; }
/* MAIL ITEMS */
.mail-item { display:grid;grid-template-columns:50px 180px 1fr 100px;align-items:center;padding:15px 20px;border-bottom:1px solid var(--border);cursor:pointer;transition:all 0.2s; }
#messageListContainer .mail-item { grid-template-columns:40px 50px 180px 1fr 100px!important; }
.mail-item:last-child { border-bottom:none; }
.mail-item:hover { background:var(--bg-subtle);border-left-color:var(--primary); }
.mail-item.unread { background:rgba(108,46,231,0.02);border-left:4px solid var(--accent); }
.mail-item.unread .sender-text, .mail-item.unread .subject-title { font-weight:800;color:var(--text-main); }
.mail-item.unread .subject-title { color:var(--primary); }
.mail-item.unread .unread-dot { margin-right:5px; }
.unread .acc-avatar-wrapper { box-shadow:0 0 0 2px var(--primary);border-radius:50%; }
.unread-dot { width:10px;height:10px;background:var(--accent);border-radius:50%;display:inline-block;box-shadow:0 0 10px rgba(23,79,164,0.4); }
.sender-text { font-size:1rem;font-weight:600;color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.subject-text { font-size:0.95rem;color:var(--text-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.subject-title { color:var(--text-main);margin-right:8px;font-weight:600; }
.mail-time { font-size:0.85rem;color:var(--text-light);text-align:right;font-weight:700;font-family:"Inter",sans-serif; }
/* READ VIEW */
.reader-subject { font-size:2.4rem;font-family:"SVN-Gilroy Bold",sans-serif;margin-bottom:30px;color:var(--text-main);line-height:1.2; }
.reader-subject-top { flex:1;min-width:0;margin:0;padding:0 12px 0 0;background:transparent;font-size:1.2rem;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.reader-header { display:flex;justify-content:space-between;align-items:center;padding-bottom:24px;border-bottom:1px solid var(--border);margin-bottom:30px; }
.wm-header-bar-read { padding-bottom:16px;border-bottom:1px solid var(--border); }
.mail-app-mode .wm-read-actions { margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap; }
.email-html-content { font-size:14.5px;line-height:1.6;color:var(--text-body);overflow-x:auto; }
.email-html-content img { max-width:100%;height:auto; }
/* COMPOSE FORM - inherits from email.css (.compose-row, labels, inputs) */
.compose-card-clean { border:none!important;box-shadow:none!important;padding:24px!important; }
.compose-card-clean .app-page-title { font-size:1.1rem;color:var(--text-main);font-family:"Inter",sans-serif!important; }
.compose-meta-wrapper { background:var(--bg-body);transition:all 0.3s ease; }
/* compose-editor-wrap: inherits from email.css (padding: 0 24px 24px, flex-grow:1, overflow-y:auto, margin-top:15px) */
.mail-app-mode .wm-compose-body { overflow-y:auto; }
.mail-app-mode .compose-editor-wrap { min-height:400px; }
.mail-app-mode .mce-edit-area iframe { min-height:400px!important; }
#iconToggleMeta { transition:transform 0.3s ease;color:var(--text-light); }
#iconToggleMeta.flipped { transform:rotate(180deg); }
/* TABLES & ALERTS */
.mail-table-card table { width:100%;border-collapse:collapse; }
.mail-table-card thead th { background:var(--bg-subtle);padding:16px 24px;text-align:left;font-size:0.8rem;font-weight:700;color:var(--text-light);border-bottom:1px solid var(--border);letter-spacing:0.5px; }
.mail-table-card tbody td { padding:16px 24px;border-bottom:1px solid var(--border);vertical-align:middle; }
.account-item-row { grid-template-columns:80px 280px 1fr 180px!important;cursor:default!important; }
.compose-save-status { font-size:0.85rem;font-weight:600;color:var(--success);background:var(--success-bg);padding:4px 12px;border-radius:50px;margin-left:15px;border:1px solid var(--success-border); }
.mail-checkbox-wrap { display:flex;align-items:center;justify-content:center; }
/* SYSTEM MODALS */
.mail-app-mode .mv-modal-overlay { padding:20px!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:all 0.3s ease; }
.mail-app-mode .mv-modal-overlay .mv-modal-box { border-radius:24px!important;background:rgba(255, 255, 255, 0.92)!important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255, 255, 255, 0.6)!important;box-shadow:0 24px 70px rgba(13, 62, 154, 0.16), 0 8px 24px rgba(13, 62, 154, 0.06)!important;font-family:"Inter",sans-serif!important;transition:all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)!important; }
.mail-app-mode .mv-modal-overlay .mv-modal-box::before { content:none!important;display:none!important; }
.mail-app-mode .mv-modal-overlay .mv-modal-box h3 { font-family:"SVN-Gilroy Bold",sans-serif!important;letter-spacing:0!important;line-height:1.25!important; }
.mail-app-mode .mv-modal-overlay .mv-modal-box p,
.mail-app-mode .mv-modal-overlay .mv-modal-box label,
.mail-app-mode .mv-modal-overlay .mv-modal-box input { font-family:"Inter",sans-serif!important;letter-spacing:0!important; }
.mail-app-mode .mv-modal-overlay .mv-modal-box button { font-family:"SVN-Gilroy Bold",sans-serif!important;letter-spacing:0!important; }
/* TINYMCE - inherits from email.css */
/* PASSWORD TOGGLE (auth.css not loaded on mail subdomain) */
.mail-app-mode .password-input-wrapper, .sl-stats-modal .password-input-wrapper { position:relative;width:100%; }
.mail-app-mode .password-input-wrapper input, .sl-stats-modal .password-input-wrapper input { padding-right:48px; }
.mail-app-mode .toggle-password-btn, .sl-stats-modal .toggle-password-btn { position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none!important;border:none!important;box-shadow:none!important;animation:none!important;cursor:pointer;color:var(--text-light);padding:4px;display:flex;align-items:center;justify-content:center;transition:color 0.2s;z-index:10;width:36px;height:36px;pointer-events:auto; }
.mail-app-mode .toggle-password-btn:hover, .sl-stats-modal .toggle-password-btn:hover { color:var(--primary); }
/* ACCOUNTS TABLE - eye button in rows */
.btn-toggle-row-pass { background:none!important;border:none!important;box-shadow:none!important;animation:none!important;cursor:pointer;color:var(--text-light);padding:4px;display:flex;align-items:center;width:28px;height:28px; }
.btn-toggle-row-pass:hover { color:var(--primary); }
/* ACCOUNT MODAL - Avatar Uploader */
#modalAccount .sl-stats-body { padding:0; }
.mail-login-title { font-family:'SVN-Gilroy Bold', sans-serif; }
.mail-login-actions { margin-top:30px;text-align:center; }
.mail-header-end { justify-content:flex-end; }
.mail-clickable { cursor:pointer; }
.mail-auto-card-primary { border-left:4px solid var(--primary); }
.wm-auto-email-label { width:auto!important;padding-right:20px; }
.mail-account-modal-content { max-width:480px; }
.mail-template-modal-content { max-width:800px; }
#accAvatarPreview,
#accAvatarInput { display:none; }
#readAvatarImg,
#conversationStack,
#conversationThread,
#compose-save-status,
#btn-delete-draft,
#btnBulkRestore,
#btnRestoreMsg { display:none; }
.wm-read-recipient { display:block;font-size:0.85rem;color:#64748b;margin-top:2px; }
.wm-skel-check { width:16px;height:16px;border-radius:5px; }
.wm-skel-star { width:20px;height:20px;border-radius:50%; }
.wm-skel-sender { width:min(142px,100%);height:14px;border-radius:999px; }
.wm-skel-sender-sub { width:88px;height:10px;border-radius:999px;opacity:.72; }
.wm-skel-subject { width:min(72%,100%);height:15px;margin-bottom:0;border-radius:999px; }
.wm-skel-preview { width:52%;height:12px;border-radius:999px;opacity:.76; }
.wm-skel-date { width:70px;height:12px;margin-left:auto;border-radius:999px; }
.wm-skel-settings-title { width:180px;height:16px; }
.wm-skel-settings-control { width:260px;height:38px;margin-top:12px; }
.wm-skel-pill { width:56px;height:30px;border-radius:999px; }
.wm-skel-avatar { width:38px;height:38px;border-radius:50%; }
.wm-skel-name { width:100px;height:16px;border-radius:4px; }
.wm-skel-cell-md { width:150px;height:16px;border-radius:4px; }
.wm-skel-cell-lg { width:160px;height:16px;border-radius:4px; }
.wm-skel-cell-sm { width:80px;height:16px;border-radius:4px; }
.wm-skel-action-sm { width:30px;height:30px;border-radius:50%; }
.wm-skel-action { width:35px;height:35px;border-radius:50%; }
.wm-template-skeleton-card { width:100%;height:120px;border-radius:24px; }
.mail-empty-muted-icon { opacity:0.1;margin-bottom:20px; }
.mail-empty-copy { font-weight:700; }
.mail-account-name { color:var(--text-main);font-size:0.95rem; }
.mail-account-email-chip { background:var(--bg-subtle);padding:4px 10px;border-radius:50px;font-size:0.85rem;font-weight:600;color:var(--text-light); }
.mail-account-secret { letter-spacing:2px;color:var(--text-light); }
.mail-context-status { padding:10px;font-size:.85rem;color:var(--text-light);text-align:center; }
.mail-context-template-command { color:var(--primary);font-weight:700; }
#formAccount.form-flex-col { gap:14px;padding:16px 20px 20px; }
/* Avatar uploader circle */
.acc-avatar-uploader-wrap { display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px 0 4px; }
.acc-avatar-circle { position:relative;width:96px;height:96px;border-radius:50%;cursor:pointer;background:var(--text-light);box-shadow:0 8px 24px rgba(15,23,42,0.14);overflow:hidden;flex-shrink:0;border:4px solid var(--bg-body);transition:box-shadow 0.2s ease,border-color 0.2s ease; }
.acc-avatar-circle:hover { border-color:var(--bg-subtle);box-shadow:0 10px 28px rgba(15,23,42,0.18); }
.acc-avatar-initials { position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:2.2rem;font-weight:800;color:#fff;font-family:'SVN-Gilroy Bold',sans-serif;letter-spacing:0;z-index:1; }
#accAvatarPreview { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;border-radius:50%; }
.acc-avatar-overlay { position:absolute;inset:0;background:rgba(0,0,0,0.5);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;opacity:0;transition:opacity 0.25s;z-index:3;border-radius:50%; }
.acc-avatar-overlay span { color:#fff;font-size:0.7rem;font-weight:700;letter-spacing:0.3px; }
.acc-avatar-circle:hover .acc-avatar-overlay { opacity:1; }
.acc-avatar-hint { font-size:0.82rem;color:var(--text-light);text-align:center;line-height:1.5;margin:0; }
.acc-avatar-hint small { font-size:0.75rem;color:var(--border); }
.acc-divider { height:1px;background:var(--border);margin:4px 0 8px; }
/* MISC & MEDIA QUERIES */
.app-page-title { font-size:1.75rem;font-weight:800;font-family:"SVN-Gilroy Bold",sans-serif!important;color:var(--primary);margin-bottom:8px; }
.app-page-subtitle { font-size:0.95rem;color:var(--text-light);font-weight:500; }
kbd { background-color:var(--bg-subtle);border:1px solid var(--border);border-radius:4px;box-shadow:0 1px 1px rgba(0,0,0,0.2);color:var(--text-body);display:inline-block;font-size:0.85em;font-weight:700;line-height:1;padding:2px 4px;white-space:nowrap; }
.empty-state-mail { padding:120px 20px;text-align:center;color:var(--text-light); }
.mail-standalone-login { background:linear-gradient(135deg,var(--bg-subtle) 0%,var(--border) 100%); }
.mail-standalone-login .auth-container { box-shadow:0 30px 100px rgba(13,62,154,0.15);border-radius:40px; }
@media (max-width: 1024px) {
  .mail-item { grid-template-columns:40px 180px 1fr 100px; }
}
@media (max-width: 768px) {
  .mail-item { grid-template-columns:40px 1fr 90px; }
  .sender-text { display:none; }
  .btn-full-mobile { width:100%!important; }
  .mail-reader-card-new { padding:30px 20px; }
  .reader-subject { font-size:1.8rem; }
}
/* ========================================================================== Mail app alignment with Manage Email + SEO Dashboard ========================================================================== */
.mail-app-mode .seo-content { display:flex;min-height:0;padding:24px; }
.mail-app-mode #app-workspace { display:flex;flex:1;min-width:0;min-height:0; }
.mail-app-mode #app-workspace.is-conversation-stack-open { padding:0; }
.mail-app-mode .view-pane { width:100%;min-width:0;min-height:0; }
.mail-app-mode .view-pane.active { display:flex;flex:1;background:rgba(255, 255, 255, 0.98);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255, 255, 255, 0.6);border-radius:16px;box-shadow:0 10px 30px rgba(13,62,154,0.05);overflow:hidden; }
.mail-app-mode #conversationStack.view-pane.active { flex-direction:column;border:0!important;border-radius:0!important;box-shadow:none!important;background:var(--mv-surface, var(--bg-body))!important; }
.mail-app-mode .wm-header-bar { padding:16px 24px;min-height:72px;border-bottom:1px solid var(--border);background:var(--bg-body); }
.mail-app-mode .wm-list { background:var(--bg-body); }
.mail-app-mode #messageListContainer .wm-item { grid-template-columns:24px 28px 42px minmax(140px,1.8fr) minmax(220px,4fr) minmax(88px,1fr);gap:14px;padding:16px 24px;border-left:0 solid transparent; }
.mail-app-mode #messageListContainer .wm-conv-item { display:grid;grid-template-columns:24px 28px 42px minmax(160px,1.8fr) minmax(240px,4fr) minmax(88px,1fr);gap:14px;align-items:center;padding:16px 24px;border-bottom:1px solid var(--border);border-left:0 solid transparent;cursor:pointer;transition:all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)!important; }
.mail-app-mode #messageListContainer .wm-conv-item:hover { background:rgba(108, 46, 231, 0.03)!important;transform:translateX(6px);box-shadow:inset 4px 0 0 var(--primary), 0 4px 12px rgba(13, 62, 154, 0.04)!important; }
.mail-app-mode #messageListContainer .wm-conv-item.unread { background:var(--bg-body);font-weight:700; }
.mail-app-mode #messageListContainer .wm-conv-item.unread .sender-text-display, .mail-app-mode #messageListContainer .wm-conv-item.unread .wm-subject-text { color:var(--primary);font-weight:800; }
.mail-app-mode #messageListContainer .sender-text-display { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.mail-app-mode #messageListContainer .wm-conv-item.is-opening { background:var(--bg-subtle);box-shadow:inset 4px 0 0 var(--primary);opacity:.78;pointer-events:none; }
.mail-app-mode #messageListContainer .wm-conv-item.is-opening .wm-row-avatar .acc-avatar-wrapper { animation:pulse-skeleton 1s ease-in-out infinite; }
.mail-app-mode .mail-load-more-wrap { padding:16px 24px 22px;background:var(--bg-body);border-top:1px solid var(--border);text-align:center; }
.mail-app-mode .mail-load-more-wrap .btn { min-width:150px;box-shadow:none; }
.mail-app-mode #messageListContainer .wm-conv-participants { min-width:0;color:var(--text-body);font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:baseline;gap:4px;font-weight:600; }
.mail-app-mode #messageListContainer .wm-conv-summary { min-width:0;color:var(--text-body);font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.mail-app-mode #messageListContainer .wm-snippet { color:var(--text-light);font-weight:500; }
.mail-app-mode #messageListContainer .wm-conv-count { min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:rgba(13,62,154,0.08);color:var(--primary);display:inline-flex;align-items:center;justify-content:center;font:800 .72rem/1 "Inter",sans-serif;line-height:1; }
.mail-app-mode #messageListContainer .wm-item.wm-item-skeleton { pointer-events:none;opacity:1;border-color:transparent!important;border-bottom-color:transparent!important;box-shadow:none!important;background:linear-gradient(90deg, rgba(13,62,154,.018), rgba(13,62,154,0)); }
.mail-app-mode #messageListContainer .wm-item-skeleton .wm-sender,
.mail-app-mode #messageListContainer .wm-item-skeleton .wm-subject { min-width:0;display:grid;align-content:center;gap:7px; }
.mail-app-mode #messageListContainer .wm-item-skeleton .wm-date { display:flex;align-items:center;justify-content:flex-end; }
.mail-app-mode #messageListContainer .wm-item-skeleton.is-wide .wm-skel-subject { width:min(86%,100%); }
.mail-app-mode #messageListContainer .wm-item-skeleton.is-wide .wm-skel-preview { width:64%; }
.mail-app-mode #messageListContainer .wm-item-skeleton.is-mid .wm-skel-sender { width:118px; }
.mail-app-mode #messageListContainer .wm-item-skeleton.is-mid .wm-skel-subject { width:68%; }
.mail-app-mode #messageListContainer .wm-item-skeleton.is-mid .wm-skel-preview { width:48%; }
.mail-app-mode #messageListContainer .wm-item-skeleton.is-compact .wm-skel-sender { width:96px; }
.mail-app-mode #messageListContainer .wm-item-skeleton.is-compact .wm-skel-subject { width:58%; }
.mail-app-mode #messageListContainer .wm-item-skeleton.is-compact .wm-skel-preview { width:36%; }
.mail-app-mode #messageListContainer .wm-item-skeleton.is-short .wm-skel-sender { width:104px; }
.mail-app-mode #messageListContainer .wm-item-skeleton.is-short .wm-skel-subject { width:50%; }
.mail-app-mode #messageListContainer .wm-item-skeleton.is-short .wm-skel-preview { width:42%; }
.mail-app-mode #messageListContainer .wm-star-cell { width:28px;height:42px;display:flex;align-items:center;justify-content:center; }
.mail-app-mode .wm-star-btn:not(.wm-icon-action) { width:30px;height:30px;padding:0;border:1px solid transparent;border-radius:50%;background:transparent;color:var(--text-light);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1); }
.mail-app-mode .wm-star-btn:not(.wm-icon-action):hover { background:var(--bg-subtle);border-color:var(--border);color:var(--primary);box-shadow:0 4px 12px rgba(15,23,42,.08);transform:scale(1.12); }
.mail-app-mode .wm-star-btn:not(.wm-icon-action):active { transform:scale(0.92); }
.mail-app-mode .wm-star-btn svg { fill:transparent; }
.mail-app-mode .wm-star-btn.is-starred, .mail-app-mode .wm-star-btn.is-active { color:#f59e0b; }
.mail-app-mode .wm-star-btn.is-starred svg, .mail-app-mode .wm-star-btn.is-active svg { fill:#f59e0b;stroke:#f59e0b; }
.mail-app-mode #messageListContainer .wm-row-avatar { width:42px;height:42px;display:flex;align-items:center;justify-content:center; }
.mail-app-mode #messageListContainer .wm-row-avatar .acc-avatar-wrapper { width:42px;height:42px; }
.mail-app-mode #messageListContainer .wm-item.is-opening { background:var(--bg-subtle);box-shadow:inset 4px 0 0 var(--primary);opacity:.78;pointer-events:none; }
.mail-app-mode #messageListContainer .wm-item.is-opening .wm-row-avatar .acc-avatar-wrapper { animation:pulse-skeleton 1s ease-in-out infinite; }
.mail-app-mode .mail-row-avatar-skeleton { width:42px;height:42px;border-radius:50%; }
.mail-app-mode .mail-reader-title-skeleton, .mail-app-mode .mail-reader-name-skeleton, .mail-app-mode .mail-reader-email-skeleton, .mail-app-mode .mail-reader-date-skeleton { display:block;border-radius:999px;background:var(--bg-subtle);animation:pulse-skeleton 1s ease-in-out infinite; }
.mail-app-mode .mail-reader-title-skeleton { width:min(520px,70vw);height:30px; }
.mail-app-mode .reader-subject-top .mail-reader-title-skeleton { width:min(460px,42vw);height:22px; }
.mail-app-mode .mail-reader-name-skeleton { width:130px;height:18px; }
.mail-app-mode .mail-reader-email-skeleton { width:210px;height:14px; }
.mail-app-mode .mail-reader-date-skeleton { width:96px;height:14px; }
.mail-app-mode .mail-reader-avatar-skeleton { animation:pulse-skeleton 1s ease-in-out infinite; }
.mail-app-mode .mail-reader-loading { display:grid;gap:12px;width:100%;padding:4px 0; }
.mail-app-mode .mail-reader-loading div { height:14px;border-radius:999px;background:var(--bg-subtle);animation:pulse-skeleton 1s ease-in-out infinite; }
.mail-app-mode .mail-reader-loading div:nth-child(1) { width:92%; }
.mail-app-mode .mail-reader-loading div:nth-child(2) { width:76%; }
.mail-app-mode .mail-reader-loading div:nth-child(3) { width:84%; }
.mail-app-mode .mail-reader-loading div:nth-child(4) { width:52%; }
.mail-app-mode #viewMessageReader .tbl-user-text { display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;column-gap:8px; }
.mail-app-mode #viewMessageReader #readSenderName { grid-column:1;grid-row:1;margin:0;white-space:nowrap; }
.mail-app-mode #viewMessageReader #readSenderEmail { grid-column:2;grid-row:1;min-width:0;margin-top:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.mail-app-mode #viewMessageReader #readRecipient { grid-column:1 / -1;grid-row:2; }
.mail-app-mode #messageListContainer .wm-item:hover { background:var(--bg-subtle);box-shadow:inset 4px 0 0 var(--primary); }
.mail-app-mode #messageListContainer .wm-item.unread { background:var(--bg-body);border-left:0;font-weight:700; }
.mail-app-mode #messageListContainer .wm-item.unread .sender-text-display, .mail-app-mode #messageListContainer .wm-item.unread .wm-subject-text { color:var(--primary);font-weight:800; }
.mail-app-mode .wm-compose-body { background:var(--bg-body); }
.mail-app-mode .compose-row { min-height:52px;padding:0 24px;border-bottom:1px solid var(--border); }
.mail-app-mode .compose-row label { width:70px;color:var(--text-light);font-size:0.9rem;font-weight:600; }
.mail-app-mode .compose-row input, .mail-app-mode .select-wrapper-clean select { padding:12px; }
.mail-app-mode .compose-editor-wrap { flex-grow:1;margin-top:15px;padding:0 24px 24px;overflow-y:auto; }
.mail-app-mode #viewCompose .wm-header-actions { align-items:center;flex-wrap:wrap;justify-content:flex-end; }
.mail-app-mode #viewCompose #btn-send-email { min-height:42px;padding:9px 18px;border-radius:999px;display:inline-flex;align-items:center;gap:8px; }
.mail-app-mode .compose-schedule-control { display:flex;align-items:center;gap:8px;color:var(--text-light);font-size:0.85rem;font-weight:700; }
.mail-app-mode .compose-schedule-control input { height:42px;padding:0 12px;border:1px solid var(--border);border-radius:10px;background:var(--bg-body);color:var(--text-body);font-family:"Inter",sans-serif;font-size:0.85rem;font-weight:600;line-height:1.3; }
.mail-app-mode .mail-attachment-field { display:grid;gap:8px;width:100%; }
.mail-app-mode .mail-attachment-field input[type="file"] { min-height:42px;padding:9px 12px;border:1px dashed var(--border);border-radius:10px;background:var(--bg-subtle);color:var(--text-body);font:600 .9rem/1.3 "Inter",sans-serif; }
.mail-app-mode .mail-attachment-list, .mail-app-mode .mail-attachments { display:flex;flex-wrap:wrap;gap:8px; }
.mail-app-mode .mail-attachment-chip, .mail-app-mode .mail-attachment-link { display:inline-flex;align-items:center;gap:6px;max-width:260px;padding:7px 10px;border:1px solid var(--border);border-radius:999px;background:var(--bg-subtle);color:var(--text-body);font:700 .82rem/1.2 "Inter",sans-serif;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.mail-app-mode .mail-attachment-link { margin-top:12px; }
.mail-app-mode .mail-attachment-chip small, .mail-app-mode .mail-attachment-link small { color:var(--text-light);font-weight:700; }
.mail-app-mode #icon-chevron-meta { transition:transform 0.3s ease; }
.mail-app-mode #icon-chevron-meta.flipped { transform:rotate(180deg); }
.mail-app-mode .mail-table-card { border-radius:0!important;border:none!important;box-shadow:none!important;flex:1;overflow:auto; }
.mail-app-mode .wm-template-card { background:var(--bg-body);border:1px solid var(--border);border-radius:16px;padding:20px;box-shadow:var(--shadow-sm);transition:0.2s; }
.mail-app-mode .wm-template-card:hover { border-color:var(--primary);box-shadow:var(--shadow-xl);transform:translateY(-3px); }
/* SEO dashboard style dropdown for mail header */
.mail-app-mode .user-header-dropdown { position:relative;cursor:pointer;display:flex;align-items:center;gap:10px; }
.mail-app-mode .user-header-dropdown::after { content:"";position:absolute;top:100%;left:0;right:0;height:20px; }
.mail-app-mode .user-dropdown-menu { display:block;position:absolute;top:calc(100% + 12px);right:0;width:260px;max-height:85vh;overflow-y:auto;padding:8px;border:1px solid var(--border)!important;border-radius:16px;background:var(--bg-body)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:0 10px 40px -10px rgba(0, 0, 0, 0.15)!important;opacity:0;visibility:hidden;transform:translateY(10px);transition:all 0.2s;z-index:9999;scrollbar-width:none; }
.mail-app-mode .user-dropdown-menu::-webkit-scrollbar { display:none; }
.mail-app-mode .user-header-dropdown:hover .user-dropdown-menu, .mail-app-mode .user-header-dropdown.active .user-dropdown-menu { opacity:1;visibility:visible;transform:translateY(0);animation:none; }
.mail-app-mode .dropdown-header { padding:12px;margin:0 0 8px;border-bottom:1px solid var(--border);border-radius:8px;background:var(--bg-subtle); }
.mail-app-mode .dropdown-header strong { display:block;color:var(--primary);font-size:14px; }
.mail-app-mode .dropdown-header span { display:block;color:var(--text-light);font-size:12px; }
.mail-app-mode .dropdown-divider { height:1px;margin:6px 0;background:var(--border); }
.mail-app-mode .dropdown-item { display:flex;align-items:center;gap:10px;margin:1px 4px;padding:10px 12px;border-radius:10px;color:var(--text-body);font-size:14px;font-weight:500;text-decoration:none;transition:0.2s; }
.mail-app-mode .dropdown-item:hover { background:var(--bg-subtle);color:var(--primary); }
.mail-app-mode .dropdown-item.text-danger { color:var(--danger)!important; }
.mail-app-mode .dropdown-item.text-danger:hover { background:var(--danger-bg);color:var(--danger-hover)!important; }

/* ========================================================================== CONVERSATION STACK VIEW ========================================================================== */
.mail-app-mode .wm-conv-stack { flex:1;min-height:0;background:var(--bg-body);overflow:hidden;animation:dropdownFadeIn .18s ease; }
.mail-app-mode #viewMessageList.is-stack-mode .wm-header-bar-list { display:none; }
.mail-app-mode .wm-stack-header { min-height:80px;padding:18px 28px;border-bottom:1px solid var(--border);background:var(--bg-body);display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:14px; }
.mail-app-mode .wm-stack-back { width:38px;height:38px;padding:0;border:0;border-radius:50%;background:var(--bg-subtle);color:var(--text-body);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:.18s;box-shadow:none; }
.mail-app-mode .wm-stack-back:hover { background:var(--border);color:var(--primary); }
.mail-app-mode .wm-stack-back svg { flex-shrink:0; }
.mail-app-mode .wm-stack-title-wrap { min-width:0;display:flex;flex-direction:column;gap:3px; }
.mail-app-mode .wm-stack-title { margin:0;color:var(--primary);font-family:"SVN-Gilroy Bold",sans-serif;font-size:1.32rem;font-weight:800;line-height:1.35;white-space:normal;overflow:visible;text-overflow:clip;word-break:break-word;letter-spacing:0; }
.mail-app-mode .wm-stack-count { color:var(--text-light);font:800 .82rem/1.2 "Inter",sans-serif; }
.mail-app-mode .wm-stack-actions { margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:10px; }
.mail-app-mode .wm-stack-list { flex:1;min-height:0;height:auto;overflow-y:auto;padding:26px 50px 42px;background:var(--bg-body);scrollbar-width:thin;scrollbar-color:var(--border) var(--bg-subtle);max-width:unset;width:100%;box-sizing:border-box; }
.mail-app-mode .wm-stack-item { position:relative;max-width:none;margin:0;background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible;padding:0 0 22px; }
.mail-app-mode .wm-stack-item + .wm-stack-item { padding-top:22px;border-top:1px solid var(--border); }
.mail-app-mode .wm-stack-item.is-current { border:0;box-shadow:none; }
.mail-app-mode .wm-stack-item-head { min-height:48px;padding:0;border-bottom:0;display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:14px;align-items:start; }
.mail-app-mode .wm-stack-avatar, .mail-app-mode .wm-stack-avatar .acc-avatar-wrapper { width:44px;height:44px; }
.mail-app-mode .wm-stack-avatar .acc-avatar-ui-v2 { font-size:17px; }
.mail-app-mode .wm-stack-sender { min-width:0;display:grid;gap:4px;color:var(--text-light);font-size:.84rem; }
.mail-app-mode .wm-stack-sender strong { color:var(--primary);font-size:.96rem;font-weight:600; }
.mail-app-mode .wm-stack-date { color:var(--text-light);font-weight:600;font-size:.82rem;padding-top:3px;text-align:right;min-width:132px;font-family:"Inter",sans-serif;white-space:nowrap; }
.mail-app-mode .wm-stack-meta { display:flex;align-items:flex-start;justify-content:flex-end;gap:10px;min-width:190px; }
.mail-app-mode .wm-stack-tools { display:flex;align-items:center;justify-content:flex-end;gap:3px;opacity:.58;transition:opacity .16s ease; }
.mail-app-mode .wm-stack-item:hover .wm-stack-tools { opacity:1; }
.mail-app-mode .wm-stack-tool.is-danger:hover { background:var(--danger);border-color:var(--danger);color:#fff!important; }
.mail-app-mode .wm-stack-more { position:relative;display:inline-flex; }
.mail-app-mode .wm-stack-more-menu { position:absolute;top:calc(100% + 8px);right:0;z-index:40;min-width:184px;padding:6px;border:1px solid var(--border);border-radius:12px;background:var(--bg-body);box-shadow:0 16px 38px rgba(15,23,42,.14);opacity:0;visibility:hidden;transform:translateY(-4px) scale(.98);transform-origin:top right;transition:opacity .14s ease,visibility .14s ease,transform .14s ease; }
.mail-app-mode .wm-stack-more.is-open .wm-stack-more-menu { opacity:1;visibility:visible;transform:translateY(0) scale(1); }
.mail-app-mode .wm-stack-menu-item { width:100%;min-height:36px;padding:8px 10px;border:0;border-radius:9px;background:transparent;color:var(--text-body);display:flex;align-items:center;gap:10px;font:600 .84rem/1.2 "Inter",sans-serif;text-align:left;white-space:nowrap;cursor:pointer; }
.mail-app-mode .wm-stack-menu-item:hover,
.mail-app-mode .wm-stack-menu-item:focus-visible { outline:none;background:var(--bg-subtle);color:var(--primary); }
.mail-app-mode .wm-stack-menu-item.is-danger { color:var(--danger); }
.mail-app-mode .wm-stack-menu-item.is-danger:hover,
.mail-app-mode .wm-stack-menu-item.is-danger:focus-visible { background:var(--danger-bg);color:var(--danger-hover); }
.mail-app-mode .wm-stack-menu-item svg { width:15px;height:15px;flex:0 0 15px;margin:0!important; }
html[data-theme="dark"] body.mail-app-mode .wm-stack-more-menu { background:var(--bg-body);border-color:var(--border);box-shadow:0 18px 42px rgba(0,0,0,.36); }
.mail-app-mode .wm-stack-body { margin-left:62px;padding:10px 0 0;background:transparent;color:var(--text-body);font-size:.94rem;line-height:1.65; }
.mail-app-mode .wm-stack-body blockquote { margin:10px 0 0;padding:0 0 0 12px;border-left:3px solid var(--border);color:var(--text-light); }
.mail-app-mode .wm-stack-body .gmail_quote, .mail-app-mode .wm-stack-body .gmail_attr { display:none!important; }
.mail-app-mode .wm-stack-sender-line { min-width:0;display:flex;align-items:center;gap:8px;line-height:1.25; }
.mail-app-mode .wm-stack-sender-line strong { max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.mail-app-mode .wm-stack-email { min-width:0;color:var(--text-light);font-weight:500;line-height:1.25;display:inline-flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transform:translateY(1px); }
.mail-app-mode .wm-stack-me { height:20px;padding:0 8px;border-radius:999px;background:var(--bg-subtle);color:var(--primary);display:inline-flex;align-items:center;font:800 .72rem/1 "Inter",sans-serif;transform:translateY(1px); }
.mail-app-mode .wm-stack-recipient { color:var(--text-light);font-size:.82rem;line-height:1.35; }
.mail-app-mode .wm-stack-body-inner { max-width:960px;color:var(--text-body);font-size:15px;line-height:1.7;word-break:break-word; }
.mail-app-mode .wm-stack-body-inner p { margin:0 0 12px; }
.mail-app-mode .wm-stack-body-inner p:last-child { margin-bottom:0; }
.mail-app-mode .wm-stack-body-inner a { color:var(--primary);text-decoration:none; }
.mail-app-mode .wm-stack-body-inner a:hover { text-decoration:underline; }
.mail-app-mode .wm-stack-body-inner img { max-width:100%;height:auto; }
.mail-app-mode .wm-stack-loading { max-width:980px;margin:0;display:grid;gap:22px; }
.mail-app-mode .wm-stack-skeleton { display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;align-items:start;padding-bottom:18px;border-bottom:1px solid var(--border); }
.mail-app-mode .wm-stack-skeleton.is-preview-card { max-width:860px;padding-bottom:0;border-bottom:0; }
.mail-app-mode .wm-stack-skel-content { min-width:0;display:grid;gap:9px;padding-top:1px; }
.mail-app-mode .wm-stack-skel-avatar { width:44px;height:44px;border-radius:50%; }
.mail-app-mode .wm-stack-skel-line { height:14px;margin-top:14px;border-radius:999px; }
.mail-app-mode .wm-stack-skel-content .wm-stack-skel-line { margin-top:0; }
.mail-app-mode .wm-stack-skel-line.is-sender { width:min(340px,78%);height:16px; }
.mail-app-mode .wm-stack-skel-line.is-meta { width:min(220px,54%);height:12px;opacity:.74; }
.mail-app-mode .wm-stack-skel-line.is-body { width:min(700px,100%);height:13px;opacity:.86; }
.mail-app-mode .wm-stack-skel-line.is-body.is-wide { width:min(780px,100%); }
.mail-app-mode .wm-stack-skel-line.is-body.is-narrow { width:min(520px,72%); }
.mail-app-mode .wm-stack-skel-line.is-short { width:260px;margin-top:2px; }
.mail-app-mode .wm-stack-skel-line.is-tiny { width:170px;height:12px;margin-top:8px; }
.mail-app-mode .wm-stack-footer { padding:20px 50px 30px; border-top:1px solid var(--border); background:var(--bg-body); display:flex; align-items:center; gap:12px; }
.mail-app-mode .wm-stack-footer-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.mail-app-mode .wm-stack-footer-actions .btn { display:inline-flex; align-items:center; gap:8px; min-height:38px; padding:0 20px; font-family:"SVN-Gilroy Bold",sans-serif; font-size:0.85rem; font-weight:700; border-radius:50px; }

/* ========================================================================== CONVERSATION THREAD ========================================================================== */
.mail-app-mode .wm-conversation-thread {
  margin-top: 32px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--bg-body);
  overflow: hidden;
  animation: dropdownFadeIn 0.3s ease;
}

.mail-app-mode .wm-thread-header {
  padding: 14px 20px;
  background: var(--bg-subtle);
  border-bottom: 1px solid var(--border);
}

.mail-app-mode .wm-thread-title {
  margin: 0;
  font-family: "SVN-Gilroy Bold", sans-serif;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--primary);
  display: flex;
  align-items: center;
  gap: 8px;
}

.mail-app-mode .wm-thread-title svg {
  flex-shrink: 0;
  color: var(--primary);
}

.mail-app-mode .wm-thread-list {
  max-height: 360px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--border) var(--bg-subtle);
}

.mail-app-mode .wm-thread-list::-webkit-scrollbar {
  width: 5px;
}

.mail-app-mode .wm-thread-list::-webkit-scrollbar-track {
  background: var(--bg-subtle);
}

.mail-app-mode .wm-thread-list::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: 999px;
}

.mail-app-mode .wm-thread-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 20px;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  transition: background 0.15s, box-shadow 0.15s;
}

.mail-app-mode .wm-thread-item:last-child {
  border-bottom: none;
}

.mail-app-mode .wm-thread-item:hover {
  background: var(--bg-subtle);
}

.mail-app-mode .wm-thread-item.wm-thread-current {
  background: var(--bg-subtle);
  box-shadow: inset 4px 0 0 var(--primary);
}

.mail-app-mode .wm-thread-item.wm-thread-current .wm-thread-sender {
  color: var(--primary);
}

.mail-app-mode .wm-thread-avatar {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
}

.mail-app-mode .wm-thread-avatar .acc-avatar-wrapper {
  width: 36px;
  height: 36px;
}

.mail-app-mode .wm-thread-content {
  flex: 1;
  min-width: 0;
}

.mail-app-mode .wm-thread-sender {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--text-body);
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mail-app-mode .wm-thread-excerpt {
  font-size: 0.82rem;
  color: var(--text-light);
  font-weight: 400;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.mail-app-mode .wm-thread-date {
  font-size: 0.75rem;
  color: var(--text-light);
  font-weight: 600;
  font-family: "Inter", sans-serif;
  margin-top: 2px;
}

/* Conversation list items */
.mail-app-mode .conversation-item {
  grid-template-columns: 50px 50px 180px 1fr 100px !important;
}
.mail-app-mode .conversation-item .badge-count {
  display: inline-flex;
  margin-left: 8px;
  vertical-align: middle;
}
.mail-app-mode .conversation-item.unread .sender-text {
  font-weight: 800;
}

/* Responsive: thread mobile */
@media (max-width: 768px) {
  .mail-app-mode .wm-thread-list {
    max-height: 280px;
  }
  .mail-app-mode .wm-thread-item {
    padding: 12px 16px;
    gap: 10px;
  }
}

@media (max-width: 1024px) {
  .mail-app-mode .seo-app { flex-direction:column; }
  .mail-app-mode .seo-sidebar { width:100%;max-height:240px;border-right:none;border-bottom:1px solid var(--border); }
  .mail-app-mode .seo-menu-wrap { padding:16px 20px; }
  .mail-app-mode .seo-content { padding:16px; }
  .mail-app-mode #messageListContainer .wm-item { grid-template-columns:24px 28px 42px 1fr; }
  .mail-app-mode #messageListContainer .wm-conv-item { grid-template-columns:24px 28px 42px 1fr; }
  .mail-app-mode #messageListContainer .wm-date { grid-column:4;text-align:left; }
  .mail-app-mode #messageListContainer .wm-subject, .mail-app-mode #messageListContainer .wm-conv-summary { grid-column:4; }
  .mail-app-mode .wm-header-bar-list { grid-template-columns:1fr;align-items:stretch; }
  .mail-app-mode .wm-list-tools { grid-column:1;justify-self:stretch;flex-wrap:wrap; }
  .mail-app-mode .wm-bulk-actions { position:static;transform:none;justify-content:flex-start;flex-wrap:wrap; }
  .mail-app-mode .wm-search-box { width:100%!important; }
  .mail-app-mode .wm-settings-grid { grid-template-columns:1fr; }
}
@media (max-width: 768px) {
  .mail-app-mode .seo-header { height:auto;min-height:64px;padding:12px 16px; }
  .mail-app-mode .user-name-label { display:none; }
  .mail-app-mode .user-dropdown-menu { position:fixed;top:64px;right:15px;left:15px;width:auto;transform:none; }
  .mail-app-mode .wm-header-bar, .mail-app-mode .wm-read-actions { align-items:stretch; }
  .mail-app-mode .wm-read-actions { width:100%;margin-left:0;flex-wrap:wrap; }
  .mail-app-mode .wm-stack-header { min-height:auto;padding:14px 16px;grid-template-columns:36px minmax(0,1fr);align-items:center;gap:10px; }
  .mail-app-mode .wm-stack-back { width:36px;height:36px; }
  .mail-app-mode .wm-stack-title { font-size:1.05rem;white-space:normal;display:block;word-break:break-word; }
  .mail-app-mode .wm-stack-actions { grid-column:1 / -1;justify-content:flex-start;margin-left:50px; }
  .mail-app-mode .wm-stack-list { height:auto !important;flex:1;min-height:0;padding:16px; }
  .mail-app-mode .wm-stack-footer { padding:14px 16px 20px; }
  .mail-app-mode .wm-stack-footer-actions { gap:8px; width:100%; }
  .mail-app-mode .wm-stack-footer-actions .btn { flex:1; justify-content:center; padding:0 10px; font-size:0.8rem; }
  .mail-app-mode .wm-stack-item-head { grid-template-columns:40px minmax(0,1fr);gap:10px; }
  .mail-app-mode .wm-stack-avatar, .mail-app-mode .wm-stack-avatar .acc-avatar-wrapper { width:38px;height:38px; }
  .mail-app-mode .wm-stack-meta { grid-column:2;min-width:0;justify-content:flex-start;flex-wrap:wrap; }
  .mail-app-mode .wm-stack-tools { opacity:1;order:2; }
  .mail-app-mode .wm-stack-date { text-align:left;min-width:0;order:1; }
  .mail-app-mode .wm-stack-body { margin-left:50px;padding:8px 0 16px; }
  .mail-app-mode .wm-stack-sender-line { flex-wrap:wrap;gap:5px 7px; }
  .mail-app-mode .wm-stack-sender-line strong { max-width:100%; }
  .mail-app-mode .wm-stack-email { max-width:100%; }
  .mail-app-mode .wm-stack-body-inner { font-size:14.5px;line-height:1.65; }
  .mail-app-mode .wm-settings-panel { padding:16px; }
  .mail-app-mode .wm-settings-card { align-items:flex-start;flex-direction:column; }
  .mail-app-mode .wm-settings-toggle { width:100%;display:flex;align-items:center;justify-content:space-between; }
}

/* Global Dynamic Modal Utilities */
.mv-modal-overlay {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(15, 23, 42, 0.5);
  backdrop-filter: blur(5px);
  z-index: 9999999;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Inter', sans-serif;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.mv-modal-overlay.active {
  opacity: 1;
}
.mv-modal-box {
  background: var(--bg-body);
  width: 95%;
  max-width: 400px;
  border-radius: 20px;
  box-shadow: var(--shadow-xl);
  transform: translateY(20px);
  transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.mv-modal-overlay.active .mv-modal-box {
  transform: translateY(0);
}
.mv-modal-body-wrap {
  padding: 30px 24px 16px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.mv-modal-icon-circle {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.mv-modal-title {
  color: var(--text-main);
  margin: 0 0 10px;
  font-size: 1.25rem;
  font-family: 'SVN-Gilroy Bold', sans-serif;
}
.mv-modal-text {
  font-size: 1.05rem;
  margin: 0;
  color: var(--text-body);
  line-height: 1.6;
}
.mv-modal-footer-wrap {
  padding: 10px 24px 30px;
  display: flex;
  justify-content: center;
}
.mv-modal-btn-action {
  padding: 12px 40px;
  border-radius: 50px;
  border: none;
  color: white;
  font-family: 'SVN-Gilroy Bold', sans-serif;
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.3s ease;
  min-width: 140px;
}

/* MyVibe Admin Shell 2.0 mail workspace */
.mail-app-mode .seo-content {
  padding: 24px;
  background: var(--mv-surface-soft, #f8fafc);
}

.mail-app-mode .view-pane.active,
.mail-list-box-new,
.mail-reader-card-new,
.mail-form-card,
.mail-table-card,
.mail-automation-card,
.mail-app-mode .wm-settings-panel,
.mail-app-mode .wm-settings-card,
.mail-app-mode .wm-template-card,
.mail-app-mode .wm-conv-stack,
.mail-app-mode .wm-stack-header,
.mail-app-mode .wm-stack-list {
  border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
  border-radius: var(--mv-radius-card, 18px) !important;
  background: var(--mv-surface, #fff) !important;
  box-shadow: var(--mv-shadow-card, 0 12px 30px rgba(13, 62, 154, 0.05)) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.mail-app-mode .view-pane.active {
  overflow: hidden;
}

.mail-reader-card-new,
.mail-form-card {
  padding: 24px;
}

.mail-app-mode .wm-header-bar,
.mail-app-mode .wm-header-bar-read,
.mail-app-mode .compose-footer,
.mail-app-mode .mail-load-more-wrap,
.mail-app-mode .wm-thread-header {
  border-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82));
  background: var(--mv-surface, #fff);
}

.mail-app-mode .wm-list,
.mail-app-mode .wm-compose-body,
.mail-app-mode .compose-meta-wrapper {
  background: var(--mv-surface, #fff);
}

.mail-app-mode .wm-list-title {
  margin: 0;
  color: var(--text-main);
  font-size: 1.28rem;
  line-height: 1.25;
  letter-spacing: 0;
}

.mail-app-mode #messageListContainer .wm-item,
.mail-app-mode #messageListContainer .wm-conv-item {
  gap: 12px;
  padding: 14px 20px;
  border-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82));
  transition: background 0.16s ease, box-shadow 0.16s ease, opacity 0.16s ease !important;
}

.mail-app-mode #messageListContainer .wm-item:hover,
.mail-app-mode #messageListContainer .wm-conv-item:hover {
  background: var(--mv-row-hover, #f8fafc) !important;
  box-shadow: inset 3px 0 0 var(--primary) !important;
  transform: none !important;
}

.mail-app-mode #messageListContainer .wm-item.unread,
.mail-app-mode #messageListContainer .wm-conv-item.unread,
.mail-item.unread {
  background: var(--mv-surface, #fff) !important;
  box-shadow: inset 3px 0 0 var(--accent);
}

.mail-app-mode #messageListContainer .wm-conv-participants,
.mail-app-mode #messageListContainer .wm-conv-summary,
.sender-text,
.subject-text {
  min-width: 0;
}

.reader-subject {
  font-size: clamp(1.55rem, 2.4vw, 2rem);
  margin-bottom: 22px;
  letter-spacing: 0;
}

.reader-header,
.wm-read-meta {
  border-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82));
}

.email-html-content,
.mail-app-mode .wm-stack-body-inner {
  font-size: 15px;
  line-height: 1.7;
}

.mail-app-mode .email-html-content .myvibe-email-body-wrapper {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.mail-app-mode .email-html-content .mv-email-body {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

.mail-app-mode .email-html-content .mv-email-display,
.mail-app-mode .email-html-content h1,
.mail-app-mode .email-html-content h2,
.mail-app-mode .email-html-content h3,
.mail-app-mode .email-html-content h4,
.mail-app-mode .email-html-content .mv-email-body strong,
.mail-app-mode .email-html-content .mv-email-body b {
  font-family: "SVN-Gilroy Bold", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  font-weight: 700 !important;
}

.mail-app-mode .compose-row {
  min-height: 52px;
  border-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82));
}

.mail-app-mode .compose-row:focus-within {
  border-bottom-color: rgba(13, 62, 154, 0.42);
  box-shadow: inset 0 -1px 0 rgba(13, 62, 154, 0.22);
}

.mail-app-mode .compose-schedule-control input,
.mail-app-mode .wm-linked-email,
.mail-app-mode .mail-attachment-field input[type="file"],
.wm-search-input {
  min-height: var(--mv-control-height, 44px);
  border-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82));
  border-radius: var(--mv-radius-control, 12px);
  background: var(--mv-surface-soft, #f8fafc);
}

.mail-app-mode #mailSearch.wm-search-input {
  border-radius: 50px !important;
}

.mail-app-mode .wm-settings-card {
  padding: 16px;
}

.mail-app-mode .wm-stack-header,
.mail-app-mode .wm-stack-list,
.mail-app-mode .wm-conv-stack {
  border-radius: 0 !important;
  box-shadow: none !important;
}

.mail-app-mode .wm-stack-list {
  border: 0 !important;
}

.mail-app-mode .mv-modal-overlay .mv-modal-box {
  border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
  border-radius: var(--mv-radius-panel, 24px) !important;
  background: var(--mv-surface, #fff) !important;
  box-shadow: var(--mv-shadow-hover, 0 18px 42px rgba(13, 62, 154, 0.08)) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.mail-standalone-login {
  background: var(--mv-surface-soft, #f8fafc);
}

.mail-standalone-login .auth-container {
  border-radius: var(--mv-radius-panel, 24px);
  border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
  box-shadow: var(--mv-shadow-card, 0 12px 30px rgba(13, 62, 154, 0.05));
}

@media (max-width: 1024px) {
  .mail-app-mode .seo-content {
    padding: 16px;
  }

  .mail-app-mode #messageListContainer .wm-item,
  .mail-app-mode #messageListContainer .wm-conv-item {
    grid-template-columns: 24px 28px 42px 1fr;
  }
}

@media (max-width: 768px) {
  .mail-app-mode .view-pane.active {
    border-radius: 16px !important;
  }

  .mail-reader-card-new,
  .mail-form-card {
    padding: 18px;
  }

  .mail-app-mode .wm-header-bar {
    padding: 14px 16px;
  }

  .mail-app-mode .wm-list-tools,
  .mail-app-mode .wm-read-actions,
  .mail-app-mode #viewCompose .wm-header-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .mail-app-mode #messageListContainer .wm-item,
  .mail-app-mode #messageListContainer .wm-conv-item {
    padding: 12px 14px;
  }

  .mail-app-mode .compose-row {
    padding: 0 16px;
  }

  .mail-app-mode .compose-editor-wrap {
    padding: 0 16px 18px;
  }
}

/* MyVibe Admin Shell 2.1 mail navigation sync */
body.mail-app-mode .seo-app.mail-app-mode {
  background: var(--mv-surface-soft, #f8fafc);
}

body.mail-app-mode .seo-sidebar {
  width: 260px;
  background: var(--mv-surface, #fff) !important;
  border-right: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
  box-shadow: none !important;
}

body.mail-app-mode .seo-brand {
  min-height: 72px;
  padding: 0 18px;
  border-bottom: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
}

body.mail-app-mode .seo-brand-logo {
  max-height: 34px;
}

body.mail-app-mode .seo-brand-text {
  color: var(--text-main);
  font-size: 0.92rem;
  letter-spacing: 0;
}

body.mail-app-mode .seo-menu-wrap {
  padding: 16px 14px 20px;
  scrollbar-width: thin;
  scrollbar-color: rgba(13, 62, 154, 0.18) transparent;
}

body.mail-app-mode .wm-btn-compose {
  min-height: 46px;
  margin: 0 2px 18px;
  border-radius: 999px !important;
  font-size: 0.94rem;
  box-shadow: 0 3px 10px rgba(13, 62, 154, 0.12) !important;
  animation: none !important;
}

body.mail-app-mode .wm-btn-compose:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 5px 14px rgba(13, 62, 154, 0.16) !important;
}

body.mail-app-mode .wm-btn-compose:focus-visible {
  transform: none !important;
  box-shadow: var(--mv-btn-focus) !important;
}

body.mail-app-mode .seo-sidebar .dash-section-label {
  margin: 20px 10px 8px;
  color: var(--mv-muted-text, #64748b);
  font-family: "Inter", sans-serif;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0;
}

body.mail-app-mode .seo-sidebar .dash-section-label:first-of-type {
  margin-top: 0;
}

body.mail-app-mode .seo-sidebar .dash-menu li {
  margin-bottom: 6px;
}

body.mail-app-mode .seo-sidebar .menu-item {
  min-height: 44px;
  padding: 10px 12px;
  gap: 11px;
  color: var(--text-body);
  border: 1px solid transparent !important;
  border-radius: var(--mv-radius-control, 12px) !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease !important;
}

body.mail-app-mode .seo-sidebar .menu-item svg {
  width: 19px;
  height: 19px;
}

body.mail-app-mode .seo-sidebar .menu-item > span:not(.wm-badge) {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.mail-app-mode .seo-sidebar .menu-item:hover,
body.mail-app-mode .seo-sidebar .menu-item:focus-visible {
  background: var(--mv-surface-soft, #f8fafc) !important;
  color: var(--primary, #0d3e9a) !important;
  border-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
  box-shadow: none !important;
  transform: none !important;
}

body.mail-app-mode .seo-sidebar .menu-item.active,
body.mail-app-mode .seo-sidebar .menu-item.active:hover,
body.mail-app-mode .seo-sidebar .menu-item.active:focus-visible {
  background: var(--primary-bg, rgba(13, 62, 154, 0.08)) !important;
  color: var(--primary, #0d3e9a) !important;
  border-color: var(--primary-border, rgba(13, 62, 154, 0.18)) !important;
  box-shadow: inset 3px 0 0 var(--primary, #0d3e9a) !important;
  transform: none !important;
}

body.mail-app-mode .seo-sidebar .wm-badge {
  min-width: 24px;
  height: 22px;
  padding: 0 7px;
  border: 1px solid rgba(255, 255, 255, 0.42);
  box-shadow: none !important;
}

body.mail-app-mode .seo-sidebar .menu-item.active .wm-badge {
  background: var(--mv-surface, #fff) !important;
  color: var(--primary, #0d3e9a) !important;
  border-color: rgba(13, 62, 154, 0.18);
}

body.mail-app-mode .seo-header.mail-header-end {
  justify-content: flex-end;
  gap: 12px;
  background: var(--mv-surface, #fff);
  border-bottom: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
  box-shadow: none;
}

body.mail-app-mode .seo-header.mail-header-end > .d-flex {
  min-width: 0;
  flex-wrap: wrap;
  justify-content: flex-end;
}

body.mail-app-mode #btnSyncIMAP,
body.mail-app-mode .dashboard-theme-toggle,
body.mail-app-mode .user-dropdown-trigger {
  min-height: 40px;
}

body.mail-app-mode #btnSyncIMAP {
  border-radius: 999px !important;
  border-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
  background: var(--mv-surface, #fff) !important;
  color: var(--primary, #0d3e9a) !important;
  box-shadow: none !important;
}

body.mail-app-mode #btnSyncIMAP:hover,
body.mail-app-mode #btnSyncIMAP:focus-visible {
  background: var(--mv-surface-soft, #f8fafc) !important;
  border-color: rgba(13, 62, 154, 0.24) !important;
  transform: none !important;
}

body.mail-app-mode .user-dropdown-trigger {
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 4px 6px 4px 12px;
  transition: background-color 0.16s ease, border-color 0.16s ease;
}

body.mail-app-mode .user-dropdown-trigger:hover,
body.mail-app-mode .user-dropdown-trigger:focus-visible {
  background: var(--mv-surface-soft, #f8fafc);
  border-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82));
}

body.mail-app-mode .seo-header .user-header-dropdown > .user-dropdown-trigger:hover,
body.mail-app-mode .seo-header .user-header-dropdown > .user-dropdown-trigger:focus-visible {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

body.mail-app-mode #messageListContainer .wm-item,
body.mail-app-mode #messageListContainer .wm-conv-item,
body.mail-app-mode .wm-thread-item {
  transform: none !important;
}

body.mail-app-mode #messageListContainer .wm-item:hover,
body.mail-app-mode #messageListContainer .wm-conv-item:hover,
body.mail-app-mode #messageListContainer .wm-item:focus-within,
body.mail-app-mode #messageListContainer .wm-conv-item:focus-within {
  background: var(--mv-row-hover, #f8fafc) !important;
  box-shadow: inset 3px 0 0 var(--primary, #0d3e9a) !important;
  transform: none !important;
}

html[data-theme="dark"] body.mail-app-mode .seo-sidebar,
html[data-theme="dark"] body.mail-app-mode .seo-header.mail-header-end {
  background: var(--mv-surface, #111827) !important;
  border-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72)) !important;
}

html[data-theme="dark"] body.mail-app-mode .seo-brand {
  border-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72));
}

html[data-theme="dark"] body.mail-app-mode .seo-brand-text {
  color: var(--mv-text, #e5e7eb);
}

html[data-theme="dark"] body.mail-app-mode .seo-sidebar .dash-section-label {
  color: var(--mv-muted-text, #94a3b8) !important;
}

html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item {
  color: var(--mv-text-muted, #cbd5e1) !important;
  border-color: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item:hover,
html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item:focus-visible {
  background: var(--mv-surface-muted, #182235) !important;
  color: var(--primary, #8bb5ff) !important;
  border-color: rgba(139, 181, 255, 0.28) !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item.active,
html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item.active:hover,
html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item.active:focus-visible {
  background: rgba(139, 181, 255, 0.14) !important;
  color: var(--primary, #8bb5ff) !important;
  border-color: rgba(139, 181, 255, 0.34) !important;
  box-shadow: inset 3px 0 0 var(--primary, #8bb5ff) !important;
  transform: none !important;
}

html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item.active .wm-badge {
  background: rgba(139, 181, 255, 0.16) !important;
  color: var(--primary, #8bb5ff) !important;
  border-color: rgba(139, 181, 255, 0.28);
}

html[data-theme="dark"] body.mail-app-mode #btnSyncIMAP,
html[data-theme="dark"] body.mail-app-mode .user-dropdown-trigger:hover,
html[data-theme="dark"] body.mail-app-mode .user-dropdown-trigger:focus-visible {
  background: var(--mv-surface-muted, #182235) !important;
  border-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72)) !important;
}

html[data-theme="dark"] body.mail-app-mode .seo-header .user-header-dropdown > .user-dropdown-trigger:hover,
html[data-theme="dark"] body.mail-app-mode .seo-header .user-header-dropdown > .user-dropdown-trigger:focus-visible {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 1024px) {
  body.mail-app-mode .seo-sidebar {
    width: 100%;
    max-height: min(34vh, 280px);
    border-right: 0 !important;
    border-bottom: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
    overflow-y: auto;
  }

  body.mail-app-mode .seo-brand {
    min-height: 64px;
  }

  body.mail-app-mode .seo-menu-wrap {
    padding: 14px 16px 16px;
  }
}

@media (max-width: 520px) {
  body.mail-app-mode .seo-header.mail-header-end {
    padding: 10px 12px;
  }

  body.mail-app-mode #btnSyncIMAP {
    width: 40px;
    min-width: 40px;
    padding: 0 !important;
  }

  body.mail-app-mode #btnSyncIMAP span {
    display: none;
  }

  body.mail-app-mode .seo-sidebar .menu-item {
    min-height: 42px;
  }
}

/* MyVibe Tool Shell 2.2 mail parity */
body.mail-app-mode .seo-brand-text {
  color: var(--primary, #0d3e9a);
  font-family: "SVN-Gilroy Bold", sans-serif;
  font-size: 1.08rem;
  font-weight: 800;
  line-height: 1.1;
  margin-left: 10px;
  padding-left: 10px;
  border-left: 2px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
  letter-spacing: 0;
  white-space: nowrap;
}

body.mail-app-mode .seo-brand .text-logo {
  font-size: 1.2rem;
  line-height: 1.1;
  letter-spacing: 0;
}

body.mail-app-mode .seo-header.mail-header-end > .d-flex {
  min-width: 0;
}

@media (max-width: 1024px) {
  body.mail-app-mode .seo-sidebar {
    width: 100%;
    max-height: none;
    border-right: 0 !important;
    border-bottom: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
    box-shadow: 0 10px 24px rgba(13, 62, 154, 0.04) !important;
    overflow: visible;
  }

  body.mail-app-mode .seo-brand {
    height: 60px;
    min-height: 60px;
    padding: 0 16px;
  }

  body.mail-app-mode .seo-brand-logo {
    max-height: 32px;
  }

  body.mail-app-mode .seo-brand-text {
    font-size: 1.04rem;
  }

  body.mail-app-mode .seo-menu-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    padding: 10px 14px 12px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  body.mail-app-mode .seo-menu-wrap::-webkit-scrollbar {
    display: none;
  }

  body.mail-app-mode .seo-menu-wrap > div:first-child {
    display: block;
    flex: 0 0 auto;
  }

  body.mail-app-mode .wm-btn-compose {
    width: auto;
    min-width: 148px;
    min-height: 40px;
    margin: 0;
    padding: 0 14px;
    box-shadow: 0 2px 8px rgba(13, 62, 154, 0.1) !important;
  }

  body.mail-app-mode .seo-sidebar .dash-section-label {
    display: none;
  }

  body.mail-app-mode .seo-sidebar .dash-menu {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    margin: 0;
    padding: 0;
  }

  body.mail-app-mode .seo-sidebar .dash-menu li {
    flex: 0 0 auto;
    margin: 0;
    scroll-snap-align: start;
  }

  body.mail-app-mode .seo-sidebar .menu-item {
    min-height: 40px;
    padding: 8px 12px;
    gap: 8px;
    border-radius: 999px !important;
    white-space: nowrap;
    box-shadow: none !important;
    transform: none !important;
  }

  body.mail-app-mode .seo-sidebar .menu-item.active,
  body.mail-app-mode .seo-sidebar .menu-item.active:hover,
  body.mail-app-mode .seo-sidebar .menu-item.active:focus-visible {
    box-shadow: 0 0 0 1px rgba(13, 62, 154, 0.16) !important;
  }

  body.mail-app-mode .seo-sidebar .menu-item svg {
    width: 18px;
    height: 18px;
  }

  body.mail-app-mode .seo-header.mail-header-end {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 60px;
    padding: 10px 14px;
    gap: 10px;
    box-shadow: none;
  }

  body.mail-app-mode .seo-header.mail-header-end > .d-flex {
    width: 100%;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 8px;
  }

  body.mail-app-mode .header-divider {
    display: none;
  }

  body.mail-app-mode .user-name-label {
    display: none;
  }
}

@media (max-width: 520px) {
  body.mail-app-mode .seo-brand {
    height: 56px;
    min-height: 56px;
    padding: 0 14px;
  }

  body.mail-app-mode .seo-brand .text-logo {
    font-size: 1.1rem;
  }

  body.mail-app-mode .seo-brand-text {
    font-size: 1rem;
  }

  body.mail-app-mode .wm-btn-compose {
    min-width: 132px;
    padding: 0 12px;
    font-size: 0.88rem;
  }

  body.mail-app-mode .seo-sidebar .menu-item {
    min-height: 38px;
    padding: 8px 11px;
    font-size: 0.88rem;
  }

  body.mail-app-mode .seo-sidebar .menu-item > span:not(.wm-badge) {
    max-width: 48vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.mail-app-mode .seo-header.mail-header-end {
    min-height: 58px;
    padding: 9px 12px;
  }

  body.mail-app-mode .dashboard-theme-toggle,
  body.mail-app-mode .mail-header-avatar,
  body.mail-app-mode #btnSyncIMAP {
    width: 40px;
    min-width: 40px;
    height: 40px;
  }
}

@media (max-width: 1024px) {
  html[data-theme="dark"] body.mail-app-mode .seo-sidebar {
    border-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72)) !important;
    box-shadow: none !important;
  }

  html[data-theme="dark"] body.mail-app-mode .seo-brand-text {
    border-left-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72));
  }

  html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item.active,
  html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item.active:hover,
  html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item.active:focus-visible {
    box-shadow: 0 0 0 1px rgba(139, 181, 255, 0.3) !important;
  }
}

/* MyVibe Tool Shell 2.3 mobile horizontal menu board */
@media (max-width: 1024px) {
  body.mail-app-mode .seo-menu-wrap {
    display: grid !important;
    grid-auto-flow: column;
    grid-auto-columns: minmax(132px, max-content);
    align-items: stretch;
    gap: 8px;
    min-height: 72px;
    padding: 10px 12px;
    background: var(--mv-surface-soft, #f8fafc);
    border-top: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
    border-bottom: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scroll-padding-inline: 12px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }

  body.mail-app-mode .seo-menu-wrap::before,
  body.mail-app-mode .seo-menu-wrap::after {
    content: "";
    width: 1px;
    height: 1px;
  }

  body.mail-app-mode .seo-menu-wrap > div:first-child:not(.dash-section-label) {
    display: contents;
  }

  body.mail-app-mode .seo-sidebar .dash-section-label {
    display: none !important;
  }

  body.mail-app-mode .seo-sidebar .dash-menu {
    display: contents !important;
  }

  body.mail-app-mode .seo-sidebar .dash-menu li {
    display: block;
    min-width: 0;
    margin: 0;
    scroll-snap-align: start;
  }

  body.mail-app-mode .wm-btn-compose,
  body.mail-app-mode .seo-sidebar .menu-item {
    width: 100%;
    min-width: 132px;
    height: 52px;
    min-height: 52px;
    justify-content: flex-start;
    align-items: center;
    gap: 9px;
    padding: 9px 12px;
    border-radius: 14px !important;
    white-space: nowrap;
  }

  body.mail-app-mode .seo-sidebar .menu-item {
    border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
    background: var(--mv-surface, #fff) !important;
    box-shadow: 0 8px 18px rgba(13, 62, 154, 0.045) !important;
    transform: none !important;
  }

  body.mail-app-mode .wm-btn-compose {
    margin: 0;
    box-shadow: 0 3px 10px rgba(13, 62, 154, 0.12) !important;
    scroll-snap-align: start;
  }

  body.mail-app-mode .seo-sidebar .menu-item:hover,
  body.mail-app-mode .seo-sidebar .menu-item:focus-visible {
    background: var(--mv-surface, #fff) !important;
    border-color: rgba(13, 62, 154, 0.24) !important;
    box-shadow: 0 10px 22px rgba(13, 62, 154, 0.07) !important;
    transform: none !important;
  }

  body.mail-app-mode .seo-sidebar .menu-item.active,
  body.mail-app-mode .seo-sidebar .menu-item.active:hover,
  body.mail-app-mode .seo-sidebar .menu-item.active:focus-visible {
    background: var(--primary-bg, rgba(13, 62, 154, 0.08)) !important;
    border-color: var(--primary-border, rgba(13, 62, 154, 0.18)) !important;
    box-shadow: inset 0 -3px 0 var(--primary, #0d3e9a), 0 10px 22px rgba(13, 62, 154, 0.07) !important;
    transform: none !important;
  }

  body.mail-app-mode .seo-sidebar .menu-item > span:not(.wm-badge) {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

@media (max-width: 520px) {
  body.mail-app-mode .seo-menu-wrap {
    grid-auto-columns: minmax(120px, max-content);
    min-height: 68px;
    padding: 9px 10px;
    scroll-padding-inline: 10px;
  }

  body.mail-app-mode .wm-btn-compose,
  body.mail-app-mode .seo-sidebar .menu-item {
    min-width: 120px;
    height: 50px;
    min-height: 50px;
    padding: 8px 11px;
    border-radius: 13px !important;
  }
}

@media (max-width: 1024px) {
  html[data-theme="dark"] body.mail-app-mode .seo-menu-wrap {
    background: var(--mv-surface-soft, #0f172a);
    border-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72));
  }

  html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item {
    background: var(--mv-surface, #111827) !important;
    border-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72)) !important;
    box-shadow: none !important;
  }

  html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item:hover,
  html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item:focus-visible {
    background: var(--mv-surface-muted, #182235) !important;
    border-color: rgba(139, 181, 255, 0.28) !important;
    box-shadow: none !important;
  }

  html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item.active,
  html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item.active:hover,
  html[data-theme="dark"] body.mail-app-mode .seo-sidebar .menu-item.active:focus-visible {
    box-shadow: inset 0 -3px 0 var(--primary, #8bb5ff) !important;
  }
}

/* MyVibe Tool Shell 2.5 mail compact mobile drawer */
@media (max-width: 1024px) {
  body.mail-app-mode .seo-header.mail-header-end {
    display: none !important;
  }

  body.mail-app-mode.tool-menu-ready::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: rgba(15, 23, 42, 0.34);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
  }

  body.mail-app-mode.tool-menu-ready.tool-menu-open::before {
    opacity: 1;
    pointer-events: auto;
  }

  body.mail-app-mode .tool-menu-toggle {
    width: 40px;
    height: 40px;
    min-width: 40px;
    margin-right: 12px;
    border-radius: 10px;
    background: transparent;
    border-color: transparent;
    box-shadow: none;
  }

  body.mail-app-mode .tool-menu-toggle:hover,
  body.mail-app-mode .tool-menu-toggle:focus-visible,
  body.mail-app-mode.tool-menu-open .tool-menu-toggle {
    background: var(--mv-surface-soft, #f8fafc);
    border-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82));
    box-shadow: none;
  }

  body.mail-app-mode.tool-menu-open .tool-menu-toggle-bars span:nth-child(1) {
    top: 0;
    transform: none;
  }

  body.mail-app-mode.tool-menu-open .tool-menu-toggle-bars span:nth-child(2) {
    top: 6px;
    opacity: 1;
    transform: none;
  }

  body.mail-app-mode.tool-menu-open .tool-menu-toggle-bars span:nth-child(3) {
    top: 12px;
    transform: none;
  }

  body.mail-app-mode.tool-menu-ready .seo-menu-wrap {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    z-index: 10002;
    display: block !important;
    width: min(380px, calc(100vw - 28px));
    height: 100dvh;
    max-height: none !important;
    min-height: 0 !important;
    flex: none !important;
    padding: 16px !important;
    gap: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scroll-padding-inline: 0 !important;
    scroll-snap-type: none !important;
    background: var(--mv-surface, #fff) !important;
    border: 0 !important;
    border-left: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
    border-radius: 0;
    box-shadow: -20px 0 48px rgba(15, 23, 42, 0.18);
    opacity: 0 !important;
    visibility: hidden;
    pointer-events: none !important;
    transform: translateX(104%) !important;
    transition: transform 0.24s ease, opacity 0.2s ease, visibility 0.2s ease;
  }

  body.mail-app-mode.tool-menu-ready.tool-menu-open .seo-menu-wrap {
    max-height: none !important;
    min-height: 0 !important;
    padding: 16px !important;
    opacity: 1 !important;
    visibility: visible;
    pointer-events: auto !important;
    transform: translateX(0) !important;
  }

  body.mail-app-mode .seo-menu-wrap::before,
  body.mail-app-mode .seo-menu-wrap::after {
    content: none !important;
    display: none !important;
  }

  body.mail-app-mode .tool-menu-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 40px;
    margin-bottom: 12px;
    color: var(--text-main, #0f172a);
    font: 800 1rem/1.2 'Inter', sans-serif;
  }

  body.mail-app-mode .tool-menu-actions {
    display: block;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
  }

  body.mail-app-mode .tool-menu-actions:empty {
    display: none !important;
  }

  body.mail-app-mode .tool-menu-actions > .d-flex {
    display: flex !important;
    flex-direction: column;
    align-items: stretch !important;
    gap: 10px !important;
    width: 100%;
  }

  body.mail-app-mode .tool-menu-actions .header-divider {
    display: none !important;
  }

  body.mail-app-mode .tool-menu-actions .dashboard-theme-toggle,
  body.mail-app-mode .tool-menu-actions #btnSyncIMAP {
    width: 100%;
    min-width: 0;
    height: 42px;
    min-height: 42px;
    justify-content: flex-start;
    gap: 10px;
    padding: 0 12px !important;
    border-radius: 12px !important;
    font-size: 0.9rem;
    box-shadow: none !important;
    transform: none !important;
  }

  body.mail-app-mode .tool-menu-actions .dashboard-theme-toggle::after {
    content: "Sáng / tối";
    color: var(--text-main, #0f172a);
    font: 700 0.9rem/1 'Inter', sans-serif;
  }

  body.mail-app-mode .tool-menu-actions .user-header-dropdown {
    position: static !important;
    display: block !important;
    width: 100%;
    padding: 10px;
    border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
    border-radius: 12px;
    background: var(--mv-surface-soft, #f8fafc);
  }

  body.mail-app-mode .tool-menu-actions .user-dropdown-trigger {
    width: 100%;
    justify-content: flex-start !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.mail-app-mode .tool-menu-actions .user-dropdown-trigger .user-name-label {
    display: flex !important;
    flex-direction: column;
    min-width: 0;
  }

  body.mail-app-mode .tool-menu-actions .mail-header-avatar {
    width: 42px;
    height: 42px;
    min-width: 42px;
  }

  body.mail-app-mode .tool-menu-actions .user-dropdown-menu {
    position: static !important;
    display: block !important;
    width: 100% !important;
    max-height: none !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    animation: none !important;
    box-shadow: none !important;
    border: 0 !important;
    background: transparent !important;
    padding: 8px 0 0 !important;
    margin: 8px 0 0 !important;
  }

  body.mail-app-mode .seo-menu-wrap > div:first-child:not(.dash-section-label) {
    display: block !important;
    margin-bottom: 12px;
  }

  body.mail-app-mode .seo-sidebar .dash-section-label,
  body.mail-app-mode .seo-sidebar .dash-divider {
    display: block !important;
  }

  body.mail-app-mode .seo-sidebar .dash-section-label {
    margin: 16px 0 8px;
    color: var(--text-light, #64748b);
    letter-spacing: 0.04em;
  }

  body.mail-app-mode .seo-sidebar .dash-menu {
    display: block !important;
    margin: 0;
    padding: 0;
  }

  body.mail-app-mode .seo-sidebar .dash-menu li {
    display: block;
    min-width: 0;
    margin: 0 0 6px;
    scroll-snap-align: none;
  }

  body.mail-app-mode .wm-btn-compose,
  body.mail-app-mode .seo-sidebar .menu-item {
    width: 100%;
    min-width: 0 !important;
    min-height: 42px;
    height: auto;
    justify-content: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px !important;
    white-space: normal;
    scroll-snap-align: none;
    transform: none !important;
  }

  body.mail-app-mode .wm-btn-compose {
    margin: 0;
    box-shadow: 0 3px 10px rgba(13, 62, 154, 0.12) !important;
  }

  body.mail-app-mode .seo-sidebar .menu-item {
    border: 1px solid transparent !important;
    box-shadow: none !important;
  }

  body.mail-app-mode .seo-sidebar .menu-item:hover,
  body.mail-app-mode .seo-sidebar .menu-item:focus-visible {
    border-color: rgba(13, 62, 154, 0.18) !important;
    background: var(--mv-surface-soft, #f8fafc) !important;
    box-shadow: none !important;
    transform: none !important;
  }

  body.mail-app-mode .seo-sidebar .menu-item.active,
  body.mail-app-mode .seo-sidebar .menu-item.active:hover,
  body.mail-app-mode .seo-sidebar .menu-item.active:focus-visible {
    border-color: var(--primary-border, rgba(13, 62, 154, 0.18)) !important;
    background: var(--primary-bg, rgba(13, 62, 154, 0.08)) !important;
    box-shadow: inset 3px 0 0 var(--primary, #0d3e9a) !important;
    transform: none !important;
  }
}

@media (max-width: 520px) {
  body.mail-app-mode.tool-menu-ready .seo-menu-wrap,
  body.mail-app-mode.tool-menu-ready.tool-menu-open .seo-menu-wrap {
    width: min(360px, calc(100vw - 22px));
    padding: 14px !important;
  }
}

html[data-theme="dark"] body.mail-app-mode.tool-menu-ready::before {
  background: rgba(0, 0, 0, 0.48);
}

html[data-theme="dark"] body.mail-app-mode.tool-menu-ready .seo-menu-wrap {
  background: var(--mv-surface, #111827) !important;
  border-left-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72)) !important;
  box-shadow: -20px 0 48px rgba(0, 0, 0, 0.32);
}

html[data-theme="dark"] body.mail-app-mode .tool-menu-actions .user-header-dropdown {
  background: var(--mv-surface-muted, #182235);
  border-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72));
}

html[data-theme="dark"] body.mail-app-mode .tool-menu-actions .dashboard-theme-toggle::after {
  color: var(--text-main, #f8fafc);
}

/* MyVibe Tool Shell 2.6 mail drawer interaction and polish */
@media (max-width: 1024px) {
  body.mail-app-mode.tool-menu-ready::before {
    z-index: 45 !important;
  }

  body.mail-app-mode.tool-menu-ready .seo-menu-wrap {
    z-index: 70 !important;
    width: min(390px, calc(100vw - 16px)) !important;
  }

  body.mail-app-mode .tool-menu-panel-head {
    position: sticky;
    top: -16px;
    z-index: 2;
    min-height: 48px;
    margin: -16px -16px 14px;
    padding: 12px 16px;
    background: var(--mv-surface, #fff);
    border-bottom: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
    color: var(--text-main, #0f172a);
  }

  body.mail-app-mode .tool-menu-close {
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--text-light, #64748b);
    font-size: 24px;
    box-shadow: none;
  }

  body.mail-app-mode .tool-menu-close:hover,
  body.mail-app-mode .tool-menu-close:focus-visible {
    background: var(--mv-surface-soft, #f8fafc);
    color: var(--primary, #0d3e9a);
    outline: none;
  }

  body.mail-app-mode .tool-menu-actions {
    margin-bottom: 14px;
    padding-bottom: 14px;
  }

  body.mail-app-mode .tool-menu-actions .dashboard-theme-toggle,
  body.mail-app-mode .tool-menu-actions #btnSyncIMAP {
    border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
    background: var(--mv-surface-soft, #f8fafc) !important;
    color: var(--primary, #0d3e9a) !important;
  }

  body.mail-app-mode .tool-menu-actions #btnSyncIMAP span {
    display: inline-flex !important;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.mail-app-mode .tool-menu-actions .user-header-dropdown {
    box-shadow: none !important;
  }

  body.mail-app-mode .tool-menu-actions .user-dropdown-trigger {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 10px !important;
    align-items: center;
  }

  body.mail-app-mode .tool-menu-actions .mail-header-avatar {
    grid-column: 1;
    grid-row: 1;
  }

  body.mail-app-mode .tool-menu-actions .user-name-label {
    grid-column: 2;
    grid-row: 1;
    align-items: flex-start;
  }

  body.mail-app-mode .tool-menu-actions .dropdown-header,
  body.mail-app-mode .tool-menu-actions .dropdown-header + .dropdown-divider {
    display: none !important;
  }

  body.mail-app-mode .tool-menu-actions .dropdown-item {
    min-height: 40px;
    border-radius: 10px;
  }

  body.mail-app-mode .seo-sidebar .dash-section-label {
    margin-top: 18px;
    font-size: 0.72rem;
  }

  body.mail-app-mode .wm-btn-compose,
  body.mail-app-mode .seo-sidebar .menu-item {
    min-height: 40px;
    padding: 9px 12px;
    font-size: 0.92rem;
  }
}

html[data-theme="dark"] body.mail-app-mode .tool-menu-panel-head {
  background: var(--mv-surface, #111827);
  border-bottom-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72));
}

html[data-theme="dark"] body.mail-app-mode .tool-menu-close:hover,
html[data-theme="dark"] body.mail-app-mode .tool-menu-close:focus-visible,
html[data-theme="dark"] body.mail-app-mode .tool-menu-actions .dashboard-theme-toggle,
html[data-theme="dark"] body.mail-app-mode .tool-menu-actions #btnSyncIMAP {
  background: var(--mv-surface-muted, #182235) !important;
  border-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72)) !important;
}

body.mail-app-mode .mail-account-action.text-danger {
  color: var(--danger, #dc2626) !important;
}

body.mail-app-mode .mail-account-action-item {
  display: none;
}

body.mail-app-mode .mail-domain-field {
  display: none;
}

/* MyVibe Tool Shell 2.7 compact mail drawer toolbar */
@media (max-width: 1024px) {
  body.mail-app-mode.tool-menu-ready .seo-menu-wrap {
    width: min(340px, calc(100vw - 32px)) !important;
    padding: 14px !important;
  }

  body.mail-app-mode.tool-menu-ready.tool-menu-open .seo-menu-wrap {
    padding: 14px !important;
  }

  body.mail-app-mode .tool-menu-panel-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 32px;
    align-items: center;
    margin: -14px -14px 12px;
    padding: 10px 14px;
  }

  body.mail-app-mode .tool-menu-close {
    justify-self: end;
  }

  body.mail-app-mode .tool-menu-actions {
    margin-bottom: 12px;
    padding-bottom: 12px;
  }

  body.mail-app-mode .tool-menu-actions > .d-flex {
    display: grid !important;
    grid-template-columns: 42px 42px minmax(0, 1fr);
    align-items: center !important;
    gap: 8px !important;
    width: 100%;
  }

  body.mail-app-mode .tool-menu-actions .user-header-dropdown {
    grid-column: 3;
    grid-row: 1;
  }

  body.mail-app-mode .tool-menu-actions .dashboard-theme-toggle {
    grid-column: 1;
    grid-row: 1;
  }

  body.mail-app-mode .tool-menu-actions #btnSyncIMAP {
    grid-column: 2;
    grid-row: 1;
  }

  body.mail-app-mode .tool-menu-actions .dashboard-theme-toggle,
  body.mail-app-mode .tool-menu-actions #btnSyncIMAP {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    justify-content: center !important;
    padding: 0 !important;
    border-radius: 50px !important;
  }

  body.mail-app-mode .tool-menu-actions .dashboard-theme-toggle::after,
  body.mail-app-mode .tool-menu-actions #btnSyncIMAP span {
    content: none !important;
    display: none !important;
  }

  body.mail-app-mode .tool-menu-actions .user-header-dropdown {
    width: 100%;
    min-width: 0;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
  }

  body.mail-app-mode .tool-menu-actions .user-dropdown-trigger {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    gap: 9px !important;
    width: 100%;
    height: 42px;
    min-width: 0;
    padding: 0 10px 0 0 !important;
    overflow: hidden;
    border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
    border-radius: 999px;
    background: var(--mv-surface-soft, #f8fafc) !important;
  }

  body.mail-app-mode .tool-menu-actions .mail-header-avatar {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border: 0;
    border-radius: 999px;
  }

  body.mail-app-mode .tool-menu-actions .user-name-label {
    min-width: 0;
    overflow: hidden;
  }

  body.mail-app-mode .tool-menu-actions .user-display-name,
  body.mail-app-mode .tool-menu-actions .user-role {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.mail-app-mode .tool-menu-actions .user-dropdown-menu {
    display: none !important;
  }

  body.mail-app-mode .wm-btn-compose {
    border-radius: 50px !important;
  }

  body.mail-app-mode .seo-sidebar .mail-account-action {
    border-color: transparent !important;
  }

  body.mail-app-mode .mail-account-action-item {
    display: block;
  }

  body.mail-app-mode .seo-sidebar .mail-account-action.text-danger:hover,
  body.mail-app-mode .seo-sidebar .mail-account-action.text-danger:focus-visible {
    color: var(--danger, #dc2626) !important;
    border-color: rgba(220, 38, 38, 0.18) !important;
    background: rgba(220, 38, 38, 0.06) !important;
  }
}

/* MyVibe Tool Shell 2.8 mail toolbar order and close button */
@media (max-width: 1024px) {
  body.mail-app-mode .tool-menu-panel-head {
    grid-template-columns: minmax(0, 1fr) 34px;
    padding: 10px 6px 10px 14px;
  }

  body.mail-app-mode .seo-menu-wrap > .tool-menu-panel-head:first-child {
    display: block !important;
    position: sticky;
    min-height: 52px;
  }

  body.mail-app-mode .tool-menu-close {
    position: absolute;
    top: 50%;
    right: 6px;
    justify-self: auto;
    width: 32px;
    height: 32px;
    border: 0 !important;
    border-radius: 50% !important;
    background: #f1f5f9 !important;
    color: #64748b !important;
    font-size: 20px;
    line-height: 1;
    transform: translateY(-50%);
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
  }

  body.mail-app-mode .tool-menu-close:hover,
  body.mail-app-mode .tool-menu-close:focus-visible {
    background: #fee2e2 !important;
    color: #ef4444 !important;
    transform: translateY(-50%) scale(1.04);
  }
}

html[data-theme="dark"] body.mail-app-mode .tool-menu-actions .user-dropdown-trigger {
  background: var(--mv-surface-muted, #182235) !important;
  border-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72)) !important;
}

html[data-theme="dark"] body.mail-app-mode .tool-menu-close {
  background: var(--mv-surface-muted, #182235) !important;
  color: var(--text-light, #94a3b8) !important;
}

html[data-theme="dark"] body.mail-app-mode .tool-menu-close:hover,
html[data-theme="dark"] body.mail-app-mode .tool-menu-close:focus-visible {
  background: rgba(239, 68, 68, 0.16) !important;
  color: #fca5a5 !important;
}

/* MyVibe Tool Shell 2.9 fixed footer actions */
@media (max-width: 1024px) {
  body.mail-app-mode.tool-menu-ready .seo-menu-wrap,
  body.mail-app-mode.tool-menu-ready.tool-menu-open .seo-menu-wrap {
    padding-bottom: 86px !important;
  }

  body.mail-app-mode .tool-menu-toggle,
  body.mail-app-mode .tool-menu-toggle:hover,
  body.mail-app-mode .tool-menu-toggle:focus-visible,
  body.mail-app-mode.tool-menu-open .tool-menu-toggle {
    border-radius: 50px !important;
  }

  body.mail-app-mode .seo-menu-wrap > .tool-menu-panel-head:first-child {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
  }

  body.mail-app-mode .tool-menu-panel-head > span {
    display: flex;
    align-items: center;
    min-height: 32px;
    line-height: 1;
  }

  body.mail-app-mode .tool-menu-user {
    display: block;
    margin: 0 0 12px;
  }

  body.mail-app-mode .tool-menu-user:empty {
    display: none;
  }

  body.mail-app-mode .tool-menu-user .user-header-dropdown {
    position: static !important;
    display: block !important;
    width: 100%;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.mail-app-mode .tool-menu-user .user-dropdown-trigger {
    display: flex !important;
    align-items: center;
    gap: 9px !important;
    width: 100%;
    min-width: 0;
    height: 42px;
    padding: 0 10px 0 0 !important;
    overflow: hidden;
    border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
    border-radius: 999px;
    background: var(--mv-surface-soft, #f8fafc) !important;
  }

  body.mail-app-mode .tool-menu-user .mail-header-avatar {
    order: 1;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    min-width: 42px;
    border: 0;
    border-radius: 999px;
  }

  body.mail-app-mode .tool-menu-user .user-name-label {
    order: 2;
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
  }

  body.mail-app-mode .tool-menu-user .user-display-name,
  body.mail-app-mode .tool-menu-user .user-role {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.mail-app-mode .tool-menu-user .user-dropdown-menu {
    display: none !important;
  }

  body.mail-app-mode .tool-menu-actions {
    position: fixed;
    right: 14px;
    bottom: 12px;
    z-index: 10003;
    width: min(312px, calc(100vw - 60px));
    margin: 0;
    padding: 10px 0 0;
    border: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0), var(--mv-surface, #fff) 28%);
    pointer-events: none;
  }

  body.mail-app-mode .tool-menu-actions > .d-flex {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end;
    align-items: center !important;
    gap: 8px !important;
    width: 100%;
    pointer-events: auto;
  }

  body.mail-app-mode .tool-menu-actions .header-divider,
  body.mail-app-mode .tool-menu-actions .user-header-dropdown {
    display: none !important;
  }

  body.mail-app-mode .tool-menu-actions .dashboard-theme-toggle,
  body.mail-app-mode .tool-menu-actions #btnSyncIMAP {
    flex: 0 0 42px !important;
    border-radius: 50px !important;
  }
}

html[data-theme="dark"] body.mail-app-mode .tool-menu-user .user-dropdown-trigger {
  background: var(--mv-surface-muted, #182235) !important;
  border-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72)) !important;
}

html[data-theme="dark"] body.mail-app-mode .tool-menu-actions {
  background: linear-gradient(180deg, rgba(17, 24, 39, 0), var(--mv-surface, #111827) 28%);
}

/* MyVibe Tool Shell 3.0 prevent mobile drawer flash on first paint */
@media (max-width: 1024px) {
  body.mail-app-mode .seo-menu-wrap {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    z-index: 70 !important;
    width: min(340px, calc(100vw - 32px)) !important;
    height: 100dvh !important;
    max-height: none !important;
    min-height: 0 !important;
    padding: 14px 14px 86px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateX(104%) !important;
  }

  body.mail-app-mode.tool-menu-open .seo-menu-wrap {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateX(0) !important;
  }
}

/* MyVibe Tool Shell 3.1 keep Mail mobile actions pinned while menu content scrolls */
@media (max-width: 1024px) {
  body.mail-app-mode.tool-menu-ready .seo-menu-wrap,
  body.mail-app-mode.tool-menu-ready.tool-menu-open .seo-menu-wrap {
    padding-bottom: 104px !important;
  }

  body.mail-app-mode.tool-menu-ready.tool-menu-open .seo-menu-wrap {
    transform: none !important;
    overflow-y: auto !important;
  }

  body.mail-app-mode.tool-menu-ready .tool-menu-actions {
    position: fixed !important;
    right: 14px !important;
    bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    z-index: 100080 !important;
    width: min(312px, calc(100vw - 60px)) !important;
    margin: 0 !important;
    padding: 10px 0 0 !important;
    border: 0 !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0), var(--mv-surface, #fff) 28%) !important;
    pointer-events: none !important;
  }

  body.mail-app-mode.tool-menu-ready .tool-menu-actions > .d-flex {
    pointer-events: auto;
  }
}

html[data-theme="dark"] body.mail-app-mode.tool-menu-ready .tool-menu-actions {
  background: linear-gradient(180deg, rgba(17, 24, 39, 0), var(--mv-surface, #111827) 28%) !important;
}

/* Keep Mail mobile drawer above floating chat controls. */
@media (max-width: 1024px) {
  body.mail-app-mode.tool-menu-ready::before {
    z-index: 100060 !important;
  }

  body.mail-app-mode .seo-menu-wrap,
  body.mail-app-mode.tool-menu-ready .seo-menu-wrap,
  body.mail-app-mode.tool-menu-open .seo-menu-wrap,
  body.mail-app-mode.tool-menu-ready.tool-menu-open .seo-menu-wrap {
    z-index: 100070 !important;
  }

  body.mail-app-mode.tool-menu-ready .tool-menu-actions,
  body.mail-app-mode.tool-menu-open .tool-menu-actions {
    z-index: 100080 !important;
  }
}

/* Mail list and conversation should fill the workspace, not sit in an inset card. */
body.mail-app-mode #app-workspace.seo-content {
  padding: 0 !important;
  overflow: hidden;
  background: var(--mv-surface, #fff);
}

body.mail-app-mode #viewMessageList.view-pane.active,
body.mail-app-mode #conversationStack.view-pane.active {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: var(--mv-surface, #fff) !important;
}

body.mail-app-mode #viewMessageList.view-pane.active,
body.mail-app-mode #conversationStack.view-pane.active {
  width: 100%;
  height: 100%;
  min-height: 0;
}