/* Global & Resets */
#masthead, #colophon, #wpadminbar, .mobile-bottom-nav, .back-to-top { display: none !important; }
html { margin-top: 0 !important; overflow: hidden; }
body { 
    padding-top: 0 !important; background: var(--bg-subtle) !important; 
    overflow: hidden; height: 100vh; display: flex; flex-direction: column; 
    margin: 0; font-family: 'Inter', sans-serif; 
}
body.seo-app-mode {
    --mv-floating-right: 30px;
    --mv-floating-chat-bottom: 30px;
    --mv-floating-chat-size: 60px;
    --mv-floating-gap: 16px;
    --mv-floating-back-bottom: calc(var(--mv-floating-chat-bottom) + var(--mv-floating-chat-size) + var(--mv-floating-gap));
}
body.seo-app-mode #mv-chat-widget {
    right: var(--mv-floating-right, 30px) !important;
    bottom: var(--mv-floating-chat-bottom, 30px) !important;
}

.dashboard-back-to-top {
    position: fixed;
    right: var(--mv-floating-right, 30px);
    bottom: var(--mv-floating-back-bottom, 106px);
    width: 50px;
    height: 50px;
    border: 0;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--vibe-gradient);
    color: #fff;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(14px);
    transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
    box-shadow: 0 6px 18px rgba(108, 46, 231, 0.32);
    z-index: 10000;
}
.dashboard-back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}
.dashboard-back-to-top:hover,
.dashboard-back-to-top:focus-visible {
    outline: none;
    filter: brightness(1.08);
    box-shadow: 0 10px 26px rgba(108, 46, 231, 0.46);
    transform: translateY(-3px);
}
.dashboard-back-to-top svg {
    width: 22px;
    height: 22px;
}

@media (max-width: 768px) {
    body.seo-app-mode {
        --mv-floating-right: 16px;
        --mv-floating-chat-bottom: calc(env(safe-area-inset-bottom, 0px) + 24px);
        --mv-floating-gap: 16px;
    }

    .dashboard-back-to-top {
        right: var(--mv-floating-right, 16px);
        bottom: var(--mv-floating-back-bottom, calc(env(safe-area-inset-bottom, 0px) + 100px));
        width: 44px;
        height: 44px;
    }
}

/* Utilities */
.mb-0 { margin-bottom: 0 !important; }
.w-100 { width: 100% !important; }
.text-center-force { text-align: center !important; }
.text-right { text-align: right !important; }
.text-light { color: var(--text-light) !important; }
.d-flex { display: flex !important; }

/* Main Layout */
.seo-app { display: flex; flex: 1; height: 100vh; width: 100vw; overflow: hidden; }
.seo-main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: var(--bg-subtle); }
.seo-content { flex: 1; padding: 30px; overflow-y: auto; position: relative; scroll-behavior: smooth; }
.seo-header { 
    height: 72px; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px); 
    border-bottom: none; display: flex; align-items: center; justify-content: space-between; 
    padding: 0 30px; z-index: 40; flex-shrink: 0; box-shadow: 0 4px 20px rgba(13, 62, 154, 0.03); 
}

/* Sidebar */
.seo-sidebar { width: 250px; background: var(--bg-body); border-right: 1px solid var(--border); display: flex; flex-direction: column; z-index: 50; flex-shrink: 0; }
.seo-brand { height: 72px; display: flex; align-items: center; padding: 0 24px; border-bottom: 1px solid var(--border); text-decoration: none; flex-shrink: 0; }
.seo-brand .text-logo { font-size: 20px; margin: 0; font-weight: 800; color: var(--primary); display: flex; align-items: center; gap: 6px; font-family: 'SVN-Gilroy Bold', sans-serif; }
.seo-brand .text-logo span { color: var(--accent); }

/* Menu */
.seo-menu-wrap { padding: 24px; overflow-y: auto; flex: 1; }
.seo-menu-wrap::-webkit-scrollbar { display: none; }
.seo-sidebar .dash-section-label { font-size: 11px; font-weight: 700; color: var(--text-light); text-transform: uppercase; margin: 20px 0 10px 16px; letter-spacing: 0.5px; font-family: 'Inter', sans-serif; }
.seo-sidebar .dash-section-label:first-child { margin-top: 0; }
.seo-sidebar .dash-menu { list-style: none; padding: 0; margin: 0; }
.seo-sidebar .dash-menu li { margin-bottom: 8px; }
.seo-sidebar .menu-item { 
    display: flex; align-items: center; gap: 12px; padding: 12px 16px; color: var(--text-body); 
    text-decoration: none; border-radius: 12px; font-weight: 600; transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)!important; 
    font-size: 0.95rem; font-family: 'Inter', sans-serif; cursor: pointer; 
}
.seo-sidebar .menu-item:hover { background: var(--bg-subtle)!important; color: var(--primary)!important; transform: translateX(6px)!important; box-shadow: inset 4px 0 0 rgba(13, 62, 154, 0.16)!important; }
.seo-sidebar .menu-item.active { background: var(--bg-subtle)!important; color: var(--primary)!important; box-shadow: inset 4px 0 0 var(--primary)!important; }
.seo-sidebar .menu-item svg { width: 20px; height: 20px; flex-shrink: 0; }

/* Components */
.app-page-title { font-weight: 800; font-size: 1.8rem; margin-bottom: 8px; margin-top: 0; color: var(--text-main); line-height: 1.2; font-family: 'SVN-Gilroy Bold', sans-serif; }

.domain-switcher { 
    display: inline-flex; align-items: center; gap: 10px; padding: 8px 18px; 
    background: var(--bg-body); border-radius: 50px; border: 1px solid var(--border); 
    cursor: pointer; transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)!important; font-weight: 700; color: var(--text-main); font-size: 0.95rem; 
}
.domain-switcher:hover { border-color: rgba(13,62,154,0.22); color: var(--primary); box-shadow: 0 10px 24px rgba(13,62,154,0.08); transform: translateY(-2px); }

.view-pane { display: none; animation: fadeIn 0.3s ease; flex-direction: column; }
.view-pane.active { display: flex; }
@keyframes fadeIn { 
    from { opacity: 0; transform: translateY(10px); } 
    to { opacity: 1; transform: translateY(0); } 
}

/* Track List (Top Domains, Referrers...) */
.track-list { list-style: none; padding: 0; margin: 0; }
.track-list li { display: flex; justify-content: space-between; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--border); }
.track-list li:last-child { border-bottom: none; }
.track-name { font-weight: 600; color: var(--text-main); display: block; font-size: 1rem; }
.track-link { font-size: 0.85rem; color: var(--text-light); text-decoration: none; max-width: 300px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.track-count { background: var(--bg-subtle); padding: 4px 14px; border-radius: 50px; font-weight: 700; font-size: 0.9rem; color: var(--primary); }

/* Action Buttons */
/* .btn-action-circle uses the global premium round design defined in style.css */

.btn-seo-submit { 
    padding: 0 24px; border-radius: 50px; font-size: 0.95rem; height: 40px; 
    font-weight: 700; font-family: 'SVN-Gilroy Bold', sans-serif; display: inline-flex; 
    align-items: center; justify-content: center; gap: 8px; box-sizing: border-box; 
    cursor: pointer; border: none; transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)!important; 
}
.seo-app .btn-primary::before { display: block; }
.seo-app .btn-primary:hover, .btn-seo-submit:hover { color: #fff!important; filter: brightness(1.04)!important; transform: translateY(-1px)!important; box-shadow: 0 5px 14px rgba(108,46,231,0.24)!important; }
.seo-app .btn-primary:active, .btn-seo-submit:active { transform: none!important; box-shadow: 0 1px 5px rgba(108,46,231,0.18)!important; }
.seo-app .btn-pulse { animation-duration: 2.4s; }

/* Toast Message */
.toast-msg { 
    position: fixed; bottom: 30px; right: 30px; background: var(--success); color: white; 
    padding: 12px 24px; border-radius: 50px; font-weight: 600; box-shadow: 0 10px 15px -3px rgba(16,185,129,0.3); 
    transform: translateY(100px); opacity: 0; transition: all 0.3s ease; z-index: 9999; 
    display: flex; align-items: center; gap: 8px; 
}
.toast-msg.show { transform: translateY(0); opacity: 1; }

/* ==========================================================================
   FORMS & INPUTS
   ========================================================================== */
.form-group { margin-bottom: 20px; }
.form-group label { display: block; font-weight: 700; margin-bottom: 6px; color: var(--text-main); font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.5px; }

.seo-app .form-group input, .seo-app .form-group select, .seo-app .form-group textarea, 
.seo-app .form-control, .qr-input-group input, .qr-input-group select, .qr-input-group textarea { 
    width: 100%; padding: 10px 14px !important; border: 1px solid var(--border) !important; 
    border-radius: 12px !important; font-size: 0.95rem !important; font-family: 'Inter', sans-serif !important; 
    transition: all 0.3s ease; background-color: var(--bg-subtle) !important; box-sizing: border-box; 
    height: 40px !important; color: var(--text-body) !important; line-height: 1.5 !important; margin: 0 !important; 
}
.seo-app .form-group input:focus, .seo-app .form-group select:focus, .seo-app .form-group textarea:focus, 
.seo-app .form-control:focus, .qr-input-group input:focus, .qr-input-group select:focus, .qr-input-group textarea:focus { 
    border-color: var(--primary) !important; outline: none; background-color: var(--bg-body) !important; 
    box-shadow: 0 0 0 3px rgba(13, 62, 154, 0.05) !important; 
}

.seo-app .form-group textarea, .seo-app textarea.form-control, .qr-input-group textarea { 
    min-height: 100px !important; resize: vertical !important; height: auto !important; 
    padding-top: 10px !important; padding-bottom: 10px !important; 
}

/* Custom Select */
.seo-app .mv-custom-select { 
    padding: 0 44px 0 14px !important; border-radius: 12px !important; background-color: var(--bg-body) !important; 
    cursor: pointer; font-weight: 600; color: var(--primary) !important; appearance: none !important; 
    -webkit-appearance: none !important; 
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230d3e9a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important; 
    background-repeat: no-repeat !important; background-position: right 16px center !important; 
    background-size: 16px !important; border: 1px solid var(--border) !important; transition: all 0.3s ease; 
    font-size: 0.95rem !important; height: 40px !important; outline: none; line-height: 40px !important; 
    font-family: 'Inter', sans-serif !important; width: 100%; box-sizing: border-box; 
}
.seo-app .mv-custom-select:focus { border-color: var(--primary) !important; box-shadow: 0 0 0 3px rgba(13, 62, 154, 0.05) !important; background-color: var(--bg-body) !important; }
.seo-app .mv-custom-select[onchange*="window.location"] { border-radius: 50px !important; }
.seo-app .mv-custom-select::-ms-expand { display: none; }

/* Color Inputs */
.seo-app input[type="color"].form-control, .color-wrap input[type="color"] { 
    padding: 2px 8px !important; cursor: pointer; height: 40px !important; border-radius: 8px !important; 
}
.color-wrap input[type="color"].form-control { 
    padding: 2px !important; height: 42px !important; border-radius: 8px !important; 
    cursor: pointer; border: 2px solid var(--border) !important; background: var(--bg-body) !important; width: 100%; 
}
.color-wrap input[type="color"].form-control:hover { border-color: var(--primary) !important; }
.color-wrap input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }
.color-wrap input[type="color"]::-webkit-color-swatch { border: none; border-radius: 6px; }

/* Shortlink Input Wrapper */
.shortlink-slug-wrapper { 
    display: flex; align-items: center; border: 1px solid var(--border); border-radius: 12px; 
    background: var(--bg-body); padding-left: 14px; transition: 0.3s; height: 40px; box-sizing: border-box; 
}
.shortlink-slug-wrapper:focus-within { border-color: var(--primary) !important; box-shadow: none !important; }
.shortlink-prefix { color: var(--text-light); font-weight: 600; font-family: monospace; font-size: 1.05rem; user-select: none; }
.seo-app .shortlink-slug-wrapper input { 
    border: none !important; background-color: transparent !important; padding: 0 6px !important; 
    box-shadow: none !important; height: 100% !important; flex: 1; outline: none; 
    font-size: 0.95rem !important; color: var(--text-main) !important; font-weight: 700; font-family: monospace !important; 
}
.seo-app .shortlink-slug-wrapper input:focus { box-shadow: none !important; background-color: transparent !important; }

/* Toggle Switch */
.qr-switch { position: relative; display: inline-block; width: 36px; height: 20px; flex-shrink: 0; margin-bottom: 0; }
.qr-switch input { opacity: 0; width: 0; height: 0; }
.qr-switch-slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--border); transition: .3s; border-radius: 20px; }
.qr-switch-slider:before { position: absolute; content: ""; height: 14px; width: 14px; left: 3px; bottom: 3px; background-color: white; transition: .3s; border-radius: 50%; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.qr-switch input:checked + .qr-switch-slider { background-color: var(--primary); }
.qr-switch input:checked + .qr-switch-slider:before { transform: translateX(16px); }

/* Range Slider */
.qr-slider-wrapper { height: 40px; display: flex; align-items: center; padding: 0; width: 100%; }
.custom-slider { -webkit-appearance: none; appearance: none; width: 100%; background: transparent !important; outline: none; margin: 0; padding: 0; border: none !important; box-shadow: none !important; }
.custom-slider::-webkit-slider-runnable-track { width: 100%; height: 6px; cursor: pointer; background: var(--border); border-radius: 5px; }
.custom-slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; height: 20px; width: 20px; border-radius: 50%; background: var(--primary); cursor: pointer; transition: transform 0.2s; box-shadow: 0 2px 6px rgba(13, 62, 154, 0.4); border: 3px solid var(--bg-body); margin-top: -7px; }
.custom-slider::-webkit-slider-thumb:hover { transform: scale(1.2); }
.custom-slider::-moz-range-track { width: 100%; height: 6px; cursor: pointer; background: var(--border); border-radius: 5px; }
.custom-slider::-moz-range-thumb { height: 20px; width: 20px; border-radius: 50%; background: var(--primary); cursor: pointer; transition: transform 0.2s; box-shadow: 0 2px 6px rgba(13, 62, 154, 0.4); border: 3px solid var(--bg-body); }
.custom-slider::-moz-range-thumb:hover { transform: scale(1.2); }

/* QR Code Generator */
.seo-form-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 24px; align-items: start; margin-bottom: 24px; }
.seo-form-grid > div { min-width: 0; }
.qr-config-panel { background: var(--bg-subtle); padding: 20px; border-radius: 12px; border: 1px solid var(--border); margin-bottom: 20px; }
.qr-config-panel h4 { font-size: 0.95rem; margin-top: 0; margin-bottom: 15px; color: var(--text-main); display: flex; align-items: center; gap: 8px; }
.qr-config-panel h4 svg { color: var(--primary); }
.qr-type-tabs::-webkit-scrollbar { display: none; }
.btn-qr-type { 
    padding: 6px 16px; border-radius: 50px; border: 1px solid var(--border); background: var(--bg-body); 
    color: var(--text-light); font-size: 0.85rem; font-family: 'Inter', sans-serif; font-weight: 600; 
    cursor: pointer; white-space: nowrap; transition: 0.2s; 
}
.btn-qr-type.active { border-color: var(--primary); background: var(--primary); color: white; }
.btn-qr-type:hover { filter: brightness(0.95); transform: translateY(-1px); }
.qr-template-manager { background: var(--bg-subtle); border: 1px dashed var(--border); padding: 20px; border-radius: 16px; margin-top: 24px; }

/* QR Preview Area */
.qr-preview-container { 
    display: flex; align-items: center; justify-content: center; background: var(--bg-body); 
    border: 2px dashed var(--border); border-radius: 16px; padding: 24px; box-shadow: var(--shadow-sm); 
    width: 100%; box-sizing: border-box; min-height: 280px; position: relative; margin-bottom: 24px; 
}
#qr-preview-box { width: 100%; max-width: 250px; display: flex; justify-content: center; align-items: center; }
#qr-preview-box canvas, #qr-preview-box svg, #qr-preview-box img { 
    width: 100% !important; max-width: 250px !important; height: auto !important; aspect-ratio: 1/1; 
    border-radius: 12px !important; box-shadow: 0 4px 15px rgba(0,0,0,0.05) !important; 
    display: block !important; margin: 0 auto !important; 
}
#qr-loading-overlay { 
    position: absolute; inset: 0; background: rgba(255, 255, 255, 0.7); backdrop-filter: blur(3px); 
    border-radius: 16px; z-index: 10; display: flex; flex-direction: column; align-items: center; 
    justify-content: center; opacity: 0; pointer-events: none; transition: opacity 0.2s ease; 
}
#qr-loading-overlay.show { opacity: 1; pointer-events: auto; }
.disabled-state { opacity: 0.4; pointer-events: none; }
.gradient-mode-toggle { 
    border: none; background: transparent; font-size: 0.75rem; color: var(--primary); 
    font-weight: 700; cursor: pointer; padding: 0; outline: none; margin-left: auto; 
    text-transform: none; letter-spacing: 0; 
}
.gradient-mode-toggle:hover { text-decoration: underline; color: var(--accent); }

/* View Content Panels */
.sl-stats-modal { 
    position: fixed; inset: 0; background: rgba(15, 23, 42, 0.7); backdrop-filter: blur(5px); 
    z-index: 10000; display: flex; align-items: center; justify-content: center; 
    opacity: 0; visibility: hidden; transition: 0.3s ease; 
}
.sl-stats-modal.active { opacity: 1; visibility: visible; }
.sl-stats-content { 
    background: var(--bg-body); width: 95%; max-width: 800px; max-height: 90vh; border-radius: 20px; 
    box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25); transform: translateY(20px); 
    transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); display: flex; flex-direction: column; overflow: hidden; 
}
.sl-stats-modal.active .sl-stats-content { transform: translateY(0); }
.sl-stats-header { padding: 20px 24px; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; background: var(--bg-body); }
.sl-stats-body { padding: 30px; overflow-y: auto; flex: 1; background: var(--bg-subtle); }
.sl-stats-close { 
    background: var(--bg-subtle); border: none; width: 36px; height: 36px; border-radius: 50%; 
    font-size: 20px; cursor: pointer; color: var(--text-light); display: flex; align-items: center; 
    justify-content: center; transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1); padding: 0; 
}
.sl-stats-close:hover { background: var(--danger-bg); border-color: var(--danger-border); color: var(--danger) !important; transform: scale(1.12); }
.sl-stats-close:active { transform: scale(0.92); }

/* Responsive */
@media (max-width: 768px) { 
    .seo-form-grid { grid-template-columns: 1fr; } 
}
/* REFACTORED CLASSES */
.seo-brand-logo { max-height: 36px; width: auto; }
.seo-brand-text { margin-left: 10px; font-weight: 800; color: var(--primary); font-size: 1.1rem; padding-left: 10px; border-left: 2px solid var(--border); font-family: 'SVN-Gilroy Bold', sans-serif; }
.mt-20 { margin-top: 20px; }
.text-danger { color: var(--danger) !important; }
.text-primary { color: var(--primary) !important; }
.dash-divider { margin: 20px 0; border-top: 1px solid var(--border); }
.domain-switcher-chevron { font-size: 10px; margin-left: 5px; color: var(--text-light); }
.sys-domain-item { color: var(--danger); font-weight: 700; }
.domain-owner-label { color: var(--text-light); font-size: 11px; }
.btn-rounded { border-radius: 50px !important; }
.header-divider { width: 1px; height: 30px; background: var(--border); margin: 0 10px; }


/* Dashboard Overview & Cards */
.empty-state-box { margin: 60px auto; text-align: center; padding: 60px 20px; }
.empty-state-title { font-weight: 800; font-size: 1.8rem; }
.app-page-subtitle { font-size: 1rem; }
.w-auto { width: auto !important; }
#seo-days-select {
    flex: 0 0 auto;
    min-width: 148px;
    padding-right: 48px !important;
    background-position: right 18px center !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.card-padding-lg { padding: 30px; }
.chart-title { font-family: 'SVN-Gilroy Bold', sans-serif; margin-bottom: 20px; font-size: 1.2rem; }
.chart-container { height: 300px; width: 100%; }
.grid-2-col { grid-template-columns: 1fr 1fr; position: relative; gap: 20px; }
.text-sm { font-size: 0.95rem; }
.col-span-2 { grid-column: span 2; }
.box-title { font-family: 'SVN-Gilroy Bold', sans-serif; margin-bottom: 20px; font-size: 1.1rem; }
.box-title-icon-accent { color: var(--accent); margin-right: 8px; }
.box-title-icon-primary { color: var(--primary); margin-right: 8px; }
.box-title-icon-success { color: var(--success); margin-right: 8px; }
.box-title-icon-warning { color: #f59e0b; margin-right: 8px; }
.box-title-icon-indigo { color: #6366f1; margin-right: 8px; }
.box-title-icon-blue { color: #3b82f6; margin-right: 8px; }
.track-list-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.truncate-70 { max-width: 70%; }
.font-mono { font-family: monospace; }
.empty-data-text { color: var(--text-light); text-align: center; padding: 20px; font-size: 0.95rem; }
.flag-icon { display: inline-block; margin-right: 8px; border-radius: 2px; box-shadow: 0 0 2px rgba(0,0,0,0.2); vertical-align: middle; }


.scroll-stat-box { flex: 1; text-align: center; background: var(--bg-subtle); padding: 15px; border-radius: 12px; border: 1px solid var(--border); }
.scroll-stat-percent { font-size: 1.5rem; font-weight: 800; color: var(--text-main); margin-bottom: 3px; }
.scroll-stat-label { font-size: 0.95rem; color: var(--text-light); }
.scroll-stat-count { font-weight: 700; color: var(--primary); margin-top: 8px; font-size: 1rem; }
.mt-10 { margin-top: 10px; }
.table-bordered { box-shadow: none !important; border: 1px solid var(--border) !important; }
.chart-container-flex { height: 200px; width: 100%; display: flex; justify-content: center; }


/* Shortlinks & Form Elements */
.stat-card-sm { padding: 16px; }
.stat-icon-sm { width: 40px; height: 40px; }
.sl-top-link-text { font-size: 1.1rem; word-break: break-all; }
.box-dashed-bg { background: var(--bg-subtle); border: 1px dashed var(--border); }
.form-flex-col { display: flex; flex-direction: column; gap: 16px; }
.form-flex-col-20 { display: flex; flex-direction: column; gap: 20px; }
.label-sm { font-size: 0.85rem; }
.label-xs { font-size: 0.8rem; }
.input-bg-white { background: var(--bg-body) !important; }
.form-row-wrap { display: flex; gap: 15px; align-items: flex-end; flex-wrap: wrap; }
.form-col-flexible { flex: 1; min-width: 160px; }
.icon-mr-8 { margin-right: 8px; }
.success-box { display: none; margin-top: 20px; padding: 24px; background: var(--success-bg); border: 1px dashed var(--success-border); border-radius: 16px; text-align: center; animation: fadeIn 0.4s ease; }
.success-box-title { color: var(--success-hover); margin-top: 0; margin-bottom: 10px; font-size: 1.1rem; font-family: 'SVN-Gilroy Bold', sans-serif; display: flex; align-items: center; justify-content: center; gap: 8px; }
.success-box-desc { margin-bottom: 20px; color: var(--success-hover); font-size: 0.95rem; }
.success-box-link { color: var(--primary); font-weight: bold; font-family: monospace; }
.inline-qr-wrap { margin: 0 auto 20px; display: flex; justify-content: center; align-items: center; width: 160px; height: 160px; background: var(--bg-body); padding: 6px; border-radius: 12px; box-shadow: 0 4px 10px rgba(0,0,0,0.05); overflow: hidden; }
.btn-group-center { display: flex; gap: 10px; justify-content: center; }
.btn-px-24 { padding: 8px 24px !important; }
.fw-bold { font-weight: 700; }
.p-24 { padding: 24px !important; }
.qr-input-group-col { flex-direction: column; gap: 12px; }
.h-40 { height: 40px !important; }
.flex-between-center-15 { display: flex !important; justify-content: space-between !important; align-items: center !important; margin-bottom: 8px; gap: 10px; }
.qr-slider-label { display: flex !important; justify-content: space-between !important; align-items: center !important; margin-bottom: 6px; gap: 8px; }
.grid-2-col-15 { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-bottom: 15px; }
.select-sm { height: 32px !important; font-size: 0.8rem !important; padding: 0 30px 0 10px !important; }
.checkbox-label-sm { display: flex; align-items: center; gap: 8px; margin-top: 14px; margin-bottom: 0; cursor: pointer; font-size: 0.75rem; color: var(--text-main); font-weight: 700; text-transform: uppercase; }
.qr-logo-upload-box { flex: 1; display: flex; align-items: center; justify-content: space-between; border: 1px dashed var(--primary); background: var(--primary-bg); border-radius: 12px; padding: 6px 12px; height: 40px; cursor: pointer; }
.qr-logo-placeholder { display: flex; align-items: center; gap: 8px; color: var(--primary); font-weight: 600; font-size: 0.85rem; }
.qr-logo-preview-img { display: none; height: 26px; border-radius: 4px; object-fit: contain; }
.qr-logo-name-text { display: none; font-size: 0.8rem; color: var(--primary); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100px; }
.flex-align-center-gap8 { display: flex; gap: 8px; align-items: center; }
.pro-editor-layout-logo { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 15px; align-items: end; }
.qr-tabs-flex { display: flex; gap: 8px; margin-bottom: 16px; overflow-x: auto; padding-bottom: 8px; scrollbar-width: none; }
.qr-tpl-box { background: var(--bg-subtle); border: 1px dashed var(--border); padding: 20px; border-radius: 16px; }
.qr-tpl-label { font-size: 0.85rem; font-weight: 700; color: var(--text-main); margin-bottom: 10px; display: block; }
.qr-tpl-select { border-radius: 50px; flex-grow: 1; min-width: 0; }
.qr-tpl-btn-save {
    border-radius: 50px;
    padding: 0 24px;
    height: 40px;
    min-width: 140px;
    white-space: nowrap;
    border: 0 !important;
    background: var(--vibe-gradient) !important;
    background-size: 101% 100% !important;
    color: #fff !important;
    box-shadow: 0 8px 18px rgba(108, 46, 231, 0.18);
}
.qr-tpl-btn-save:hover,
.qr-tpl-btn-save:focus-visible {
    background: var(--vibe-gradient) !important;
    background-size: 101% 100% !important;
    color: #fff !important;
    filter: brightness(1.04);
    box-shadow: 0 12px 24px rgba(108, 46, 231, 0.26) !important;
    transform: translateY(-1px);
}
.qr-tpl-btn-save:active {
    transform: none;
    box-shadow: 0 5px 12px rgba(108, 46, 231, 0.18) !important;
}
.qr-tpl-btn-save:disabled,
.qr-tpl-btn-save[disabled] {
    opacity: 0.62;
    cursor: not-allowed;
    filter: grayscale(0.15);
    transform: none !important;
    box-shadow: none !important;
}
@media (max-width: 640px) {
    #seo-days-select {
        min-width: 140px;
    }

    .qr-tpl-box .flex-align-center-gap8 {
        flex-wrap: wrap;
    }

    .qr-tpl-select,
    .qr-tpl-btn-save {
        flex: 1 1 100%;
        width: 100%;
    }
}
.qr-preview-col { display: flex; flex-direction: column; position: sticky; top: 100px; }
.qr-preview-label { font-size: 0.85rem; text-align: center; margin-bottom: 12px; font-weight: 700; }
.qr-loading-spinner { width: 36px; height: 36px; border: 3px solid rgba(13,62,154,0.1); border-top-color: var(--primary); border-radius: 50%; animation: spin 0.8s linear infinite; margin-bottom: 8px; }
.qr-loading-text { font-size: 0.8rem; color: var(--primary); font-weight: 600; }
.qr-download-btn { border-radius: 50px; padding: 14px; }
.flex-col-grow { display: flex; flex-direction: column; flex-grow: 1; }
.textarea-h100 { flex-grow: 1; height: 100% !important; min-height: 120px; }
.seo-upload-box-inner { flex-grow: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; min-height: 200px; }
.seo-upload-placeholder { flex-direction: column; align-items: center; }
.seo-upload-icon { margin-bottom: 8px; }
.seo-upload-text { margin: 0; color: var(--text-light); font-weight: 600; font-size: 0.85rem; }
.seo-image-preview-img { max-width: 100%; max-height: 200px; border-radius: 8px; margin: 0 auto; object-fit: cover; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
.flex-end-mt10 { display: flex; justify-content: flex-end; margin-top: 10px; }
.align-self-center { align-self: center; }
.flex-space-between-20 { display: flex; gap: 20px; justify-content: space-between; }
.thead-light { background: var(--bg-subtle); }
.text-095 { font-size: 0.95rem !important; }
.text-09 { font-size: 0.9rem !important; }
.font-mono-text { font-family: monospace; font-size: 0.95rem; color: var(--text-light); }
.font-bold-main-095 { font-weight: 600; color: var(--text-body); font-size: 0.95rem; }
.text-64748b-095 { color: var(--text-light); font-size: 0.95rem; }
.domain-badge-primary { color: var(--primary); font-size: 0.8rem; font-weight: 700; }
.icon-v-middle-mr4 { vertical-align: middle; margin-right: 4px; }
.admin-seo-upload-box { padding: 20px; min-height: 160px; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.admin-seo-image-preview-img { max-width: 100%; max-height: 160px; border-radius: 8px; margin: 0 auto; object-fit: cover; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
.admin-perm-label { font-size: 0.85rem; margin-bottom: 15px; color: var(--primary); font-family: 'SVN-Gilroy Bold', sans-serif; text-transform: uppercase; }
.admin-perm-checkbox-label { display: flex; align-items: center; gap: 12px; margin-bottom: 15px; cursor: pointer; font-size: 0.95rem; font-weight: 600; color: var(--text-main); }
.transition-03s { transition: 0.3s; }


.sl-stats-title { margin: 0; font-size: 1.2rem; color: var(--text-main); font-family: 'SVN-Gilroy Bold', sans-serif; }


.btn-group-flex { margin-top: 10px; display: flex; gap: 10px; }
.flex-1 { flex: 1 !important; }
.sl-stats-url-display { font-size: 0.9rem; color: var(--primary); font-family: monospace; font-weight: 700; margin-top: 4px; }
.mb-24 { margin-bottom: 24px !important; }
.box-title-sm { font-family: 'SVN-Gilroy Bold', sans-serif; margin-bottom: 12px; font-size: 1.05rem; }
.chart-box-white { height: 250px; width: 100%; background: var(--bg-body); border-radius: 12px; padding: 15px; border: 1px solid var(--border); margin-bottom: 24px; }


/* ==========================================================================
   TABLE COLUMN WIDTHS - Shortlinks Table
   ========================================================================== */
.th-sl-link    { width: 20%; }
.th-sl-dest    { width: 25%; }
.th-sl-creator { width: 15%; }
.th-sl-time    { width: 15%; }
.th-sl-clicks  { width: 10%; }
.th-sl-action  { width: 15%; }

/* ==========================================================================
   TABLE COLUMN WIDTHS - Admin SEO Table
   ========================================================================== */
.th-seo-domain { width: 20%; }
.th-seo-title  { width: 25%; }
.th-seo-desc   { width: 30%; }
.th-seo-image  { width: 15%; }
.th-seo-action { width: 10%; }

/* ==========================================================================
   TABLE COLUMN WIDTHS - Permissions Table
   ========================================================================== */
.th-perm-user   { width: 25%; }
.th-perm-access { width: 40%; }
.th-perm-limit  { width: 20%; }
.th-perm-action { width: 15%; }

/* ==========================================================================
   DOMAIN SWITCHER - Inline Refactor
   ========================================================================== */
.domain-switcher { position: relative; user-select: none; }
.domain-dropdown-menu { 
    position: absolute; top: calc(100% + 15px); left: 0; 
    min-width: 250px; max-height: 350px; overflow-y: auto; 
    background: rgba(255, 255, 255, 0.88)!important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-radius: 16px; 
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.12), 0 4px 12px rgba(15, 23, 42, 0.04)!important; 
    border: 1px solid rgba(255, 255, 255, 0.6)!important; opacity: 0; visibility: hidden; 
    transform: translateY(12px) scale(0.96); transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); z-index: 9999; 
    padding: 8px; scrollbar-width: none; 
}
.domain-dropdown-menu::-webkit-scrollbar { display: none; }
.domain-switcher.active .domain-dropdown-menu { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
.domain-dropdown-item { 
    display: block; padding: 10px 15px; color: var(--text-body); 
    text-decoration: none; font-size: 13px; font-weight: 500; 
    border-radius: 8px; transition: 0.2s; line-height: 1.4; 
}
.domain-dropdown-item:hover, .domain-dropdown-item.active { background: var(--bg-subtle); color: var(--primary); }

/* Admin identity sync: SEO/Mail keep their own app shell, but share the same visual grammar. */
.seo-app .seo-header,
.mail-app-mode .seo-header {
    border-bottom: 1px solid rgba(226, 232, 240, 0.78);
    box-shadow: 0 6px 24px rgba(13, 62, 154, 0.04);
}

.seo-app .seo-sidebar,
.mail-app-mode .seo-sidebar {
    border-color: rgba(226, 232, 240, 0.9);
}

.seo-app .seo-sidebar .menu-item,
.mail-app-mode .seo-sidebar .menu-item {
    letter-spacing: 0;
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)!important;
}

.seo-app .seo-sidebar .menu-item:hover,
.mail-app-mode .seo-sidebar .menu-item:hover {
    background: var(--bg-subtle)!important;
    color: var(--primary)!important;
    transform: translateX(6px)!important;
    box-shadow: inset 4px 0 0 rgba(13, 62, 154, 0.16)!important;
}

.seo-app .seo-sidebar .menu-item.active,
.mail-app-mode .seo-sidebar .menu-item.active {
    background: var(--primary-bg)!important;
    color: var(--primary)!important;
    box-shadow: inset 4px 0 0 var(--primary)!important;
}

.seo-app .domain-switcher,
.mail-app-mode .domain-switcher,
.seo-app .user-dropdown-menu,
.mail-app-mode .user-dropdown-menu,
.seo-app .domain-dropdown-menu,
.mail-app-mode .domain-dropdown-menu {
    border-color: rgba(226, 232, 240, 0.9);
    box-shadow: 0 14px 34px rgba(13, 62, 154, 0.08);
}

.seo-app .btn,
.mail-app-mode .btn {
    font-family: "SVN-Gilroy Bold", sans-serif;
    letter-spacing: 0;
}

.seo-perm-badge {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 9px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 800;
    margin: 2px;
    border: 1px solid transparent;
}

.seo-perm-badge.is-on {
    background: var(--primary-bg);
    border-color: var(--primary-border);
    color: var(--primary);
}

.seo-perm-badge.is-off {
    background: var(--bg-subtle);
    border-color: var(--border);
    color: var(--text-light);
}

.admin-seo-thumb {
    width: 42px;
    height: 32px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: var(--bg-subtle);
}

.spinner-icon-sm {
    width: 14px;
    height: 14px;
    border-width: 2px;
}

.spinner-icon-inline {
    margin: 0 8px 0 0;
    border-top-color: #fff;
}
.spinner-icon-inline:only-child {
    margin: 0 !important;
}

.qr-canvas-fit {
    width: 100% !important;
    height: auto !important;
}

.qr-bank-preview {
    width: 100%;
    max-width: 300px;
    height: auto;
    display: block;
    margin: 0 auto;
    border-radius: 12px;
}

/* Shared SEO/Mail controls aligned with Mail dashboard actions. */
/* Redundant btn-action-circle styles removed; inherited from global style.css */

body.seo-app-mode .sl-stats-modal,
body.mail-app-mode .sl-stats-modal {
    background: rgba(15, 23, 42, 0.52);
    backdrop-filter: blur(6px);
    padding: 24px;
}

body.seo-app-mode .sl-stats-content,
body.mail-app-mode .sl-stats-content {
    border: 1px solid var(--border);
    border-radius: 20px;
    box-shadow: 0 24px 64px rgba(15, 23, 42, 0.2);
    transform: translateY(16px) scale(0.98);
    transition: transform 0.24s ease, opacity 0.24s ease;
}

body.seo-app-mode .sl-stats-modal.active .sl-stats-content,
body.mail-app-mode .sl-stats-modal.active .sl-stats-content {
    transform: translateY(0) scale(1);
}

body.seo-app-mode .sl-stats-header,
body.mail-app-mode .sl-stats-header {
    min-height: 72px;
    padding: 20px 24px;
    border-bottom: 1px solid var(--border);
}

body.seo-app-mode .sl-stats-close,
body.mail-app-mode .sl-stats-close {
    border: 1px solid transparent;
    background: var(--bg-subtle);
    color: var(--text-light);
}

body.seo-app-mode .sl-stats-close:hover,
body.seo-app-mode .sl-stats-close:focus-visible,
body.mail-app-mode .sl-stats-close:hover,
body.mail-app-mode .sl-stats-close:focus-visible {
    background: var(--border);
    border-color: var(--border);
    color: var(--primary);
    outline: none;
}

@media (max-width: 768px) {
    body.seo-app-mode .sl-stats-modal,
    body.mail-app-mode .sl-stats-modal {
        align-items: flex-end;
        padding: 12px;
    }

    body.seo-app-mode .sl-stats-content,
    body.mail-app-mode .sl-stats-content {
        width: 100%;
        max-width: 100% !important;
        max-height: calc(100vh - 24px);
        border-radius: 18px 18px 0 0;
    }

    body.seo-app-mode .sl-stats-header,
    body.mail-app-mode .sl-stats-header {
        min-height: 64px;
        padding: 16px 20px;
    }

    body.seo-app-mode .sl-stats-body,
    body.mail-app-mode .sl-stats-body {
        padding: 20px;
    }
}

/* ==========================================================================
   PREMIUM GLASSMORPHISM & MICRO-ANIMATIONS OVERRIDES (SEO DASHBOARD)
   ========================================================================== */
.seo-app .cat-list-box, 
.seo-app .stat-card,
.seo-app .chart-box-white {
  background: rgba(255, 255, 255, 0.92)!important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.6)!important;
  box-shadow: 0 16px 40px rgba(13, 62, 154, 0.06), 0 4px 12px rgba(13, 62, 154, 0.02)!important;
  border-radius: 16px!important;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)!important;
}

.seo-app .cat-list-box:hover, 
.seo-app .stat-card:hover {
  transform: translateY(-4px)!important;
  box-shadow: 0 20px 48px rgba(13, 62, 154, 0.12), 0 6px 16px rgba(13, 62, 154, 0.04)!important;
}

/* MyVibe Admin Shell 2.0 alignment */
.seo-app,
.seo-main,
.seo-content {
    background: var(--mv-surface-soft, #f8fafc);
}

.seo-header,
.mail-app-mode .seo-header {
    height: var(--mv-topbar-height, 72px);
    padding: 0 24px;
    border-bottom: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
    background: var(--mv-surface, #fff);
    box-shadow: var(--mv-shadow-card, 0 12px 30px rgba(13, 62, 154, 0.05));
}

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

.seo-brand {
    border-bottom-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82));
}

.seo-menu-wrap {
    padding: 16px 14px;
}

.seo-sidebar .dash-section-label {
    margin: 18px 10px 8px;
    color: var(--mv-muted-text, #64748b);
    letter-spacing: 0;
}

.seo-sidebar .menu-item,
.mail-app-mode .seo-sidebar .menu-item {
    min-height: 42px;
    padding: 10px 12px;
    border: 1px solid transparent;
    border-radius: 12px;
    font-size: 0.93rem;
    line-height: 1.2;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease !important;
}

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

.seo-sidebar .menu-item.active,
.mail-app-mode .seo-sidebar .menu-item.active {
    background: var(--primary-bg) !important;
    border-color: var(--primary-border);
    color: var(--primary) !important;
    box-shadow: inset 3px 0 0 var(--primary) !important;
    transform: none !important;
}

.seo-content {
    padding: 24px;
}

.app-page-title {
    font-size: clamp(1.55rem, 2vw, 1.9rem);
    letter-spacing: 0;
}

.domain-switcher,
.seo-app .mv-custom-select[onchange*="window.location"] {
    min-height: var(--mv-control-height, 44px);
    border-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82));
    border-radius: 999px;
    background: var(--mv-surface, #fff);
    box-shadow: none;
}

.domain-switcher:hover {
    border-color: rgba(13, 62, 154, 0.28);
    box-shadow: var(--mv-shadow-card, 0 12px 30px rgba(13, 62, 154, 0.05));
    transform: none;
}

.domain-dropdown-menu {
    background: var(--mv-surface, #fff) !important;
    border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
    border-radius: var(--mv-radius-card, 18px);
    box-shadow: var(--mv-shadow-hover, 0 18px 42px rgba(13, 62, 154, 0.08)) !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.seo-app .cat-list-box,
.seo-app .stat-card,
.seo-app .chart-box-white,
.seo-app .qr-config-panel,
.seo-app .qr-template-manager,
.seo-app .qr-logo-upload-box,
.seo-app .qr-tpl-box,
.seo-app .scroll-stat-box,
.seo-app .sl-stats-content,
.seo-app #qr-preview-box,
.seo-app .admin-table-card {
    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;
    -webkit-backdrop-filter: none;
}

.seo-app .cat-list-box:hover,
.seo-app .stat-card:hover {
    transform: none !important;
    box-shadow: var(--mv-shadow-hover, 0 18px 42px rgba(13, 62, 154, 0.08)) !important;
}

.seo-app .form-group input,
.seo-app .form-group select,
.seo-app .form-group textarea,
.seo-app .form-control,
.qr-input-group input,
.qr-input-group select,
.qr-input-group textarea,
.shortlink-slug-wrapper {
    min-height: var(--mv-control-height, 44px) !important;
    border-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
    border-radius: var(--mv-radius-control, 12px) !important;
    background-color: var(--mv-surface-soft, #f8fafc) !important;
}

.seo-app .form-group input:focus,
.seo-app .form-group select:focus,
.seo-app .form-group textarea:focus,
.seo-app .form-control:focus,
.qr-input-group input:focus,
.qr-input-group select:focus,
.qr-input-group textarea:focus,
.shortlink-slug-wrapper:focus-within {
    background-color: var(--mv-surface, #fff) !important;
    box-shadow: var(--mv-focus-ring, 0 0 0 3px rgba(13, 62, 154, 0.16)) !important;
}

.qr-preview-container {
    border-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82));
    background: var(--mv-surface, #fff);
    box-shadow: var(--mv-shadow-card, 0 12px 30px rgba(13, 62, 154, 0.05));
}

.seo-form-grid {
    gap: 20px;
}

.seo-app .btn-primary:hover,
.btn-seo-submit:hover {
    transform: translateY(-1px) !important;
}

@media (max-width: 1024px) {
    .seo-app {
        flex-direction: column;
    }

    .seo-sidebar {
        width: 100%;
        max-height: 250px;
        border-right: none;
        border-bottom: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
    }

    .seo-menu-wrap {
        padding: 14px 16px;
    }
}

@media (max-width: 768px) {
    html,
    body {
        overflow: auto;
    }

    body {
        height: auto;
        min-height: 100vh;
    }

    .seo-app {
        min-height: 100vh;
        height: auto;
        overflow: visible;
    }

    .seo-main {
        min-height: 0;
    }

    .seo-header {
        height: auto;
        min-height: 64px;
        padding: 12px 16px;
        flex-wrap: wrap;
        gap: 12px;
    }

    .seo-content {
        padding: 16px;
        overflow: visible;
    }

    .domain-switcher {
        max-width: 100%;
    }

    .domain-dropdown-menu {
        left: 0;
        right: 0;
        min-width: min(280px, calc(100vw - 32px));
    }
}

/* MyVibe Tool Shell 2.2 responsive header/sidebar */
body.seo-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;
    letter-spacing: 0;
    white-space: nowrap;
}

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

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

body.seo-app-mode .seo-header .user-header-dropdown {
    flex: 0 0 auto;
}

body.seo-app-mode .seo-header .user-name-label {
    min-width: 0;
}

@media (max-width: 1024px) {
    body.seo-app-mode .seo-app {
        flex-direction: column;
    }

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

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

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

    body.seo-app-mode .seo-brand-text {
        font-size: 1.04rem;
        padding-left: 10px;
        margin-left: 10px;
        border-left: 2px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
    }

    body.seo-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.seo-app-mode .seo-menu-wrap::-webkit-scrollbar {
        display: none;
    }

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

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

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

    body.seo-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;
    }

    body.seo-app-mode .seo-sidebar .menu-item:hover,
    body.seo-app-mode .seo-sidebar .menu-item:focus-visible {
        box-shadow: none !important;
        transform: none !important;
    }

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

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

    body.seo-app-mode .seo-header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        min-height: 60px;
        padding: 10px 14px;
        gap: 10px;
        box-shadow: none;
    }

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

    body.seo-app-mode .domain-switcher {
        width: 100%;
        min-width: 0;
        height: 40px;
        min-height: 40px;
        padding: 0 12px;
        justify-content: flex-start;
    }

    body.seo-app-mode .domain-switcher #current-domain-display {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

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

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

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

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

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

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

    body.seo-app-mode .seo-sidebar .menu-item > span {
        max-width: 54vw;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

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

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

    body.seo-app-mode .seo-header a.btn-rounded {
        width: 40px;
        min-width: 40px;
        height: 40px;
        padding: 0 !important;
        gap: 0;
        overflow: hidden;
        font-size: 0;
    }

    body.seo-app-mode .seo-header a.btn-rounded svg {
        margin: 0;
    }

    body.seo-app-mode .domain-switcher {
        height: 40px;
        padding: 0 10px;
        font-size: 0.88rem;
    }
}

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

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

    html[data-theme="dark"] body.seo-app-mode .seo-sidebar .menu-item.active,
    html[data-theme="dark"] body.seo-app-mode .seo-sidebar .menu-item.active:hover,
    html[data-theme="dark"] body.seo-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.seo-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.seo-app-mode .seo-menu-wrap::before,
    body.seo-app-mode .seo-menu-wrap::after {
        content: "";
        width: 1px;
        height: 1px;
    }

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

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

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

    body.seo-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;
        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;
        white-space: nowrap;
    }

    body.seo-app-mode .seo-sidebar .menu-item:hover,
    body.seo-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.seo-app-mode .seo-sidebar .menu-item.active,
    body.seo-app-mode .seo-sidebar .menu-item.active:hover,
    body.seo-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.seo-app-mode .seo-sidebar .menu-item > span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

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

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

/* MyVibe Tool Shell 2.4 mobile hamburger menu */
body.seo-app-mode .seo-brand-row {
    display: flex;
    align-items: center;
    min-height: 72px;
    border-bottom: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
    background: var(--mv-surface, #fff);
    flex-shrink: 0;
}

body.seo-app-mode .seo-brand-row .seo-brand {
    flex: 1 1 auto;
    min-width: 0;
    height: 72px;
    border-bottom: 0;
}

body.seo-app-mode .tool-menu-toggle {
    display: none;
    width: 42px;
    height: 42px;
    min-width: 42px;
    margin-right: 14px;
    border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
    border-radius: 14px;
    background: var(--mv-surface, #fff);
    color: var(--primary, #0d3e9a);
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(13, 62, 154, 0.06);
    transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

body.seo-app-mode .tool-menu-toggle:hover,
body.seo-app-mode .tool-menu-toggle:focus-visible {
    background: var(--mv-surface-soft, #f8fafc);
    border-color: rgba(13, 62, 154, 0.24);
    outline: none;
}

body.seo-app-mode .tool-menu-toggle:focus-visible {
    box-shadow: var(--mv-focus-ring, 0 0 0 3px rgba(13, 62, 154, 0.16));
}

body.seo-app-mode .tool-menu-toggle-bars {
    position: relative;
    display: block;
    width: 18px;
    height: 14px;
}

body.seo-app-mode .tool-menu-toggle-bars span {
    position: absolute;
    left: 0;
    width: 18px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transition: transform 0.2s ease, opacity 0.2s ease, top 0.2s ease;
}

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

body.seo-app-mode .tool-menu-toggle-bars span:nth-child(2) {
    top: 6px;
}

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

@media (max-width: 1024px) {
    body.seo-app-mode .seo-brand-row {
        min-height: 60px;
    }

    body.seo-app-mode .seo-brand-row .seo-brand {
        height: 60px;
        min-height: 60px;
    }

    body.seo-app-mode .tool-menu-toggle {
        display: inline-flex;
    }

    body.seo-app-mode.tool-menu-ready .seo-menu-wrap {
        max-height: 0;
        min-height: 0;
        padding-top: 0;
        padding-bottom: 0;
        border-top-color: transparent;
        border-bottom-color: transparent;
        opacity: 0;
        pointer-events: none;
        transform: translateY(-8px);
        transition: max-height 0.24s ease, min-height 0.24s ease, padding 0.24s ease, opacity 0.2s ease, transform 0.24s ease, border-color 0.2s ease;
    }

    body.seo-app-mode.tool-menu-ready.tool-menu-open .seo-menu-wrap {
        max-height: 96px;
        min-height: 72px;
        padding-top: 10px;
        padding-bottom: 10px;
        border-top-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82));
        border-bottom-color: var(--mv-border-soft, rgba(226, 232, 240, 0.82));
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    body.seo-app-mode.tool-menu-open .tool-menu-toggle {
        background: var(--primary-bg, #eff6ff);
        border-color: var(--primary-border, #bfdbfe);
    }

    body.seo-app-mode.tool-menu-open .tool-menu-toggle-bars span:nth-child(1) {
        top: 6px;
        transform: rotate(45deg);
    }

    body.seo-app-mode.tool-menu-open .tool-menu-toggle-bars span:nth-child(2) {
        opacity: 0;
        transform: scaleX(0.45);
    }

    body.seo-app-mode.tool-menu-open .tool-menu-toggle-bars span:nth-child(3) {
        top: 6px;
        transform: rotate(-45deg);
    }
}

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

    body.seo-app-mode .seo-brand-row .seo-brand {
        height: 56px;
        min-height: 56px;
    }

    body.seo-app-mode .tool-menu-toggle {
        width: 40px;
        height: 40px;
        min-width: 40px;
        margin-right: 12px;
        border-radius: 13px;
    }

    body.seo-app-mode.tool-menu-ready.tool-menu-open .seo-menu-wrap {
        min-height: 68px;
        padding-top: 9px;
        padding-bottom: 9px;
    }
}

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

html[data-theme="dark"] body.seo-app-mode .tool-menu-toggle:hover,
html[data-theme="dark"] body.seo-app-mode .tool-menu-toggle:focus-visible,
html[data-theme="dark"] body.seo-app-mode.tool-menu-open .tool-menu-toggle {
    background: var(--mv-surface-muted, #182235);
    border-color: rgba(139, 181, 255, 0.28);
}

/* MyVibe Tool Shell 2.5 compact mobile drawer */
body.seo-app-mode .tool-menu-panel-head,
body.seo-app-mode .tool-menu-actions {
    display: none;
}

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

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

    body.seo-app-mode .seo-header {
        min-height: 54px;
        padding: 8px 14px;
        box-shadow: none;
    }

    body.seo-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.seo-app-mode .tool-menu-toggle:hover,
    body.seo-app-mode .tool-menu-toggle:focus-visible,
    body.seo-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.seo-app-mode.tool-menu-open .tool-menu-toggle-bars span:nth-child(1) {
        top: 0;
        transform: none;
    }

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

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

    body.seo-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.seo-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.seo-app-mode .seo-menu-wrap::before,
    body.seo-app-mode .seo-menu-wrap::after {
        content: none !important;
        display: none !important;
    }

    body.seo-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.seo-app-mode .tool-menu-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
        border-radius: 10px;
        background: var(--mv-surface-soft, #f8fafc);
        color: var(--text-main, #0f172a);
        font-size: 22px;
        line-height: 1;
        cursor: pointer;
    }

    body.seo-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.seo-app-mode .tool-menu-actions:empty {
        display: none !important;
    }

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

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

    body.seo-app-mode .tool-menu-actions .theme-toggle-btn,
    body.seo-app-mode .tool-menu-actions .dashboard-theme-toggle,
    body.seo-app-mode .tool-menu-actions a.btn-rounded {
        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.seo-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.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .user-header-dropdown {
        position: static !important;
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr);
        align-items: center;
        gap: 10px;
        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.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .user-header-dropdown > .header-avatar {
        grid-column: 1;
        grid-row: 1;
        width: 42px;
        height: 42px;
        min-width: 42px;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .user-header-dropdown > .user-name-label {
        display: flex !important;
        grid-column: 2;
        grid-row: 1;
        flex-direction: column;
        min-width: 0;
    }

    body.seo-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.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .user-dropdown-menu {
        grid-column: 1 / -1;
    }

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

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

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

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

    body.seo-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;
        border: 1px solid transparent !important;
        box-shadow: none !important;
        transform: none !important;
    }

    body.seo-app-mode .seo-sidebar .menu-item:hover,
    body.seo-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.seo-app-mode .seo-sidebar .menu-item.active,
    body.seo-app-mode .seo-sidebar .menu-item.active:hover,
    body.seo-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.seo-app-mode.tool-menu-ready .seo-menu-wrap,
    body.seo-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.seo-app-mode.tool-menu-ready::before {
    background: rgba(0, 0, 0, 0.48);
}

html[data-theme="dark"] body.seo-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.seo-app-mode .tool-menu-close,
html[data-theme="dark"] body.seo-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.seo-app-mode .tool-menu-actions .dashboard-theme-toggle::after {
    color: var(--text-main, #f8fafc);
}

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

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

    body.seo-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.seo-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.seo-app-mode .tool-menu-close:hover,
    body.seo-app-mode .tool-menu-close:focus-visible {
        background: var(--mv-surface-soft, #f8fafc);
        color: var(--primary, #0d3e9a);
        outline: none;
    }

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

    body.seo-app-mode .tool-menu-actions .theme-toggle-btn,
    body.seo-app-mode .tool-menu-actions .dashboard-theme-toggle,
    body.seo-app-mode .tool-menu-actions a.btn-rounded {
        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.seo-app-mode .tool-menu-actions .user-info-mini {
        display: none !important;
    }

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

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

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

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

html[data-theme="dark"] body.seo-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.seo-app-mode .tool-menu-close:hover,
html[data-theme="dark"] body.seo-app-mode .tool-menu-close:focus-visible,
html[data-theme="dark"] body.seo-app-mode .tool-menu-actions .theme-toggle-btn,
html[data-theme="dark"] body.seo-app-mode .tool-menu-actions .dashboard-theme-toggle,
html[data-theme="dark"] body.seo-app-mode .tool-menu-actions a.btn-rounded {
    background: var(--mv-surface-muted, #182235) !important;
    border-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72)) !important;
}

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

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

    body.seo-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 6px 10px 14px;
    }

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

    body.seo-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.seo-app-mode .tool-menu-close:hover,
    body.seo-app-mode .tool-menu-close:focus-visible {
        background: #fee2e2 !important;
        color: #ef4444 !important;
        transform: translateY(-50%) scale(1.04);
    }
}

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

html[data-theme="dark"] body.seo-app-mode .tool-menu-close:hover,
html[data-theme="dark"] body.seo-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.seo-app-mode.tool-menu-ready .seo-menu-wrap,
    body.seo-app-mode.tool-menu-ready.tool-menu-open .seo-menu-wrap {
        padding-bottom: 86px !important;
    }

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

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

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

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

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

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-header-dropdown {
        position: static !important;
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr);
        align-items: center;
        gap: 10px;
        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);
        box-shadow: none !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .header-avatar {
        grid-column: 1;
        grid-row: 1;
        width: 42px;
        height: 42px;
        min-width: 42px;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-name-label {
        display: flex !important;
        grid-column: 2;
        grid-row: 1;
        flex-direction: column;
        min-width: 0;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-dropdown-menu {
        grid-column: 1 / -1;
        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;
        box-shadow: none !important;
        border: 0 !important;
        background: transparent !important;
        padding: 8px 0 0 !important;
        margin: 8px 0 0 !important;
    }

    body.seo-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.seo-app-mode .tool-menu-actions > .d-flex {
        display: flex !important;
        justify-content: flex-end;
        align-items: center !important;
        gap: 8px !important;
        width: 100%;
        pointer-events: auto;
    }

    body.seo-app-mode .tool-menu-actions .theme-toggle-btn,
    body.seo-app-mode .tool-menu-actions .dashboard-theme-toggle {
        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.seo-app-mode .tool-menu-actions .dashboard-theme-toggle::after {
        display: none !important;
        content: none !important;
    }
}

html[data-theme="dark"] body.seo-app-mode .tool-menu-user .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.seo-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.seo-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.seo-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 SEO mobile drawer cleanup */
@media (max-width: 1024px) {
    body.seo-app-mode:not(.mail-app-mode).tool-menu-ready::before {
        z-index: 100040 !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .seo-sidebar {
        z-index: 100045 !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .seo-menu-wrap {
        z-index: 100050 !important;
        padding: 14px !important;
    }

    body.seo-app-mode:not(.mail-app-mode).tool-menu-open .seo-menu-wrap {
        z-index: 100050 !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .seo-main > .seo-header {
        height: 0 !important;
        min-height: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        box-shadow: none !important;
        overflow: visible;
    }

    body.seo-app-mode:not(.mail-app-mode) .seo-main > .seo-header > .domain-switcher,
    body.seo-app-mode:not(.mail-app-mode) .seo-main > .seo-header > .d-flex {
        display: none !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-domain {
        display: block;
        margin: 0 0 12px;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-domain:empty {
        display: none;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-domain .domain-switcher {
        position: relative;
        display: flex !important;
        width: 100%;
        min-width: 0;
        min-height: 42px;
        height: auto;
        padding: 0 12px;
        border-radius: 14px;
        background: var(--mv-surface-soft, #f8fafc);
        box-shadow: none;
        transform: none;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-domain .domain-switcher #current-domain-display {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-domain .domain-dropdown-menu {
        display: none;
        position: static !important;
        width: 100% !important;
        max-height: 220px;
        overflow-y: auto;
        margin-top: 8px;
        padding: 6px;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        box-shadow: none !important;
        border-radius: 12px;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-domain .domain-switcher.active .domain-dropdown-menu {
        display: block;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions {
        position: static !important;
        right: auto !important;
        bottom: auto !important;
        z-index: auto !important;
        width: 100% !important;
        margin: 0 0 12px !important;
        padding: 0 0 12px !important;
        border-bottom: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
        background: transparent !important;
        pointer-events: auto !important;
    }

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

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions > .d-flex {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100%;
    }

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

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .dashboard-theme-toggle {
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        flex: 0 0 42px;
        border-radius: 50px !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions a.btn-rounded {
        width: auto !important;
        min-width: 0 !important;
        flex: 1 1 160px;
        height: 42px;
        min-height: 42px;
        justify-content: center;
        border-radius: 50px !important;
        font-size: 0.9rem;
    }
}

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

/* MyVibe Tool Shell 3.2 SEO mobile footer actions and account chip */
body.seo-app-mode .user-email-label {
    display: none;
}

@media (max-width: 1024px) {
    body.seo-app-mode:not(.mail-app-mode) .seo-menu-wrap {
        padding: 14px 14px 96px !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-domain {
        display: none !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user {
        display: block;
        margin: 0 0 14px;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-header-dropdown {
        position: static !important;
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) 30px;
        align-items: center;
        gap: 10px;
        width: 100%;
        min-height: 42px;
        padding: 0 10px 0 0 !important;
        overflow: visible;
        border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
        border-radius: 999px !important;
        background: var(--mv-surface-soft, #f8fafc) !important;
        box-shadow: none !important;
        cursor: pointer;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-header-dropdown.active {
        border-radius: 18px !important;
        padding-bottom: 8px !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-header-dropdown::after {
        content: "\f078";
        position: static !important;
        inset: auto !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        grid-column: 3;
        grid-row: 1;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        justify-self: center;
        width: 28px;
        height: 28px;
        border: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82));
        border-radius: 50%;
        background: var(--mv-surface, #fff);
        color: var(--primary, #0d3e9a);
        font-family: "Font Awesome 6 Free", sans-serif;
        font-size: 10px;
        font-weight: 900;
        line-height: 1;
        transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-header-dropdown.active::after {
        transform: rotate(180deg);
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .header-avatar {
        grid-column: 1;
        grid-row: 1;
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        border: 0 !important;
        border-radius: 999px !important;
    }

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

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-display-name {
        display: block !important;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.2;
        color: var(--text-main);
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-email-label {
        display: block !important;
        max-width: 100%;
        margin-top: 1px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 12px;
        font-weight: 400;
        line-height: 1.2;
        color: var(--text-light);
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-role,
    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-info-mini {
        display: none !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-dropdown-menu {
        grid-column: 1 / -1;
        position: static !important;
        display: none !important;
        width: 100% !important;
        max-height: min(52dvh, 420px) !important;
        overflow-y: auto !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        box-shadow: none !important;
        border: 0 !important;
        border-top: 1px solid var(--mv-border-soft, rgba(226, 232, 240, 0.82)) !important;
        border-radius: 0 !important;
        background: transparent !important;
        padding: 10px 0 2px !important;
        margin: 10px 0 0 !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-header-dropdown.active .user-dropdown-menu {
        display: block !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions {
        position: fixed !important;
        right: 14px !important;
        bottom: 12px !important;
        z-index: 100060 !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.seo-app-mode:not(.mail-app-mode) .tool-menu-actions > .d-flex {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        justify-content: flex-end !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100%;
        min-width: 0;
        pointer-events: auto;
    }

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

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .dashboard-theme-toggle {
        order: 1;
        flex: 0 0 42px !important;
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        padding: 0 !important;
        justify-content: center !important;
        border-radius: 50px !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .dashboard-theme-toggle::after {
        display: none !important;
        content: none !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .domain-switcher {
        order: 2;
        position: relative;
        display: flex !important;
        flex: 1 1 auto !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 42px !important;
        min-height: 42px !important;
        padding: 0 12px !important;
        gap: 8px;
        border-radius: 50px !important;
        background: var(--mv-surface-soft, #f8fafc) !important;
        box-shadow: none !important;
        transform: none !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .domain-switcher #current-domain-display {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .domain-switcher-chevron {
        flex: 0 0 auto;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .domain-dropdown-menu {
        position: absolute !important;
        top: auto !important;
        right: 0 !important;
        bottom: calc(100% + 8px) !important;
        left: auto !important;
        display: none;
        width: min(280px, calc(100vw - 88px)) !important;
        min-width: 0 !important;
        max-height: min(42dvh, 260px) !important;
        overflow-y: auto !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        border-radius: 14px !important;
        z-index: 100070 !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .domain-switcher.active .domain-dropdown-menu {
        display: block !important;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions a.btn-rounded {
        order: 3;
        flex: 0 0 42px !important;
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        padding: 0 !important;
        justify-content: center !important;
        gap: 0 !important;
        border-radius: 50px !important;
        font-size: 0 !important;
        overflow: hidden;
    }

    body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions a.btn-rounded svg {
        flex: 0 0 16px;
        width: 16px;
        height: 16px;
    }
}

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

html[data-theme="dark"] body.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-header-dropdown,
html[data-theme="dark"] body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .domain-switcher,
html[data-theme="dark"] body.seo-app-mode:not(.mail-app-mode) .tool-menu-actions .domain-dropdown-menu {
    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.seo-app-mode:not(.mail-app-mode) .tool-menu-user .user-header-dropdown::after {
    background: var(--mv-surface, #121a2b);
    border-color: var(--mv-border-soft, rgba(71, 85, 105, 0.72));
}

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

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

    body.seo-app-mode:not(.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.seo-app-mode:not(.mail-app-mode).tool-menu-ready .tool-menu-actions > .d-flex {
        pointer-events: auto;
    }
}

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