/* ==============================================
   ACCOUNT SIDEBAR — Exact Wix Replica
   ============================================== */

:root { --vn-sidebar-w: 280px; }

.wix-sidebar .nav-primary .nav-item>a::before {
    display: none !important;
}

.wix-sidebar * {
    transition: none !important;
}

.wix-sidebar {
    background: #F4F4F4 !important;
    border-right: 1px solid #ebebeb !important;
    width: var(--vn-sidebar-w) !important;
}
.wix-sidebar__resize { display: none; }

/* Dark mode: pure-black sidebar. */
body[data-background-color="dark"] .wix-sidebar,
.wix-sidebar[data-background-color="dark2"],
body[data-background-color="dark"] .wix-sidebar .wix-sidebar-scroll,
body[data-background-color="dark"] .wix-sidebar .sidebar-wrapper,
body[data-background-color="dark"] .wix-sidebar .sidebar-content {
    background: #000000 !important;
    border-right-color: rgba(255,255,255,0.30) !important;
}

/* Widen the sidebar (Manus-style) and shrink the main panel to match.
   The collapsed rail rules override this with their own 64px width. */
/* Desktop only. On ≤991px atlantis turns the sidebar into an off-canvas drawer,
   so these fixed-width rules must NOT apply there (else the main panel is forced to
   calc(100% - 290px) on phones and the content is squished into ~100px). */
@media (min-width: 992px) {
    body:not(.sidebar-collapsed) .sidebar,
    body:not(.sidebar-collapsed) .wix-sidebar {
        width: var(--vn-sidebar-w) !important;
        min-width: var(--vn-sidebar-w) !important;
        max-width: var(--vn-sidebar-w) !important;
    }
    body:not(.sidebar-collapsed) .main-panel {
        width: calc(100% - var(--vn-sidebar-w)) !important;
    }

    /* Collapse/expand glides instead of snapping. The small delay lets the
       click register before the panel starts moving, so opening the sidebar
       reads as a deliberate animation rather than an instant jump. */
    .sidebar,
    .wix-sidebar,
    .main-panel {
        transition:
            width .3s cubic-bezier(.16, 1, .3, 1) .07s,
            min-width .3s cubic-bezier(.16, 1, .3, 1) .07s,
            max-width .3s cubic-bezier(.16, 1, .3, 1) .07s;
    }

    body:not(.sidebar-collapsed) .wix-sidebar__resize {
        display: block;
        position: absolute;
        top: 0;
        right: -2px;
        width: 8px;
        height: 100%;
        cursor: col-resize;
        z-index: 50;
        background: transparent;
    }
    body:not(.sidebar-collapsed) .wix-sidebar__resize:hover,
    body.is-sidebar-resizing .wix-sidebar__resize {
        background: rgba(22, 163, 74, 0.45);
    }
    body.is-sidebar-resizing .sidebar,
    body.is-sidebar-resizing .wix-sidebar,
    body.is-sidebar-resizing .main-panel {
        transition: none !important;
    }
    body.is-sidebar-resizing {
        cursor: col-resize;
        user-select: none;
    }
}

/* Users who prefer reduced motion get the old instant toggle. */
@media (prefers-reduced-motion: reduce) {
    .sidebar,
    .wix-sidebar,
    .main-panel {
        transition: none !important;
    }
}

/* ── Mobile / tablet (≤991px): full-width content + off-canvas sidebar drawer ── */
@media (max-width: 991px) {
    /* Sidebar slides off-canvas; opens when atlantis sets `nav_open`. */
    .wix-sidebar,
    .sidebar {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        height: 100% !important;
        width: 288px !important;
        min-width: 288px !important;
        max-width: 86% !important;
        z-index: 100060 !important;
        transform: translateX(-100%);
        /* Delay visibility:hidden until the slide-out finishes so the close
           animation is preserved; transform animates normally. */
        transition: transform .28s ease, visibility 0s linear .28s;
        /* No edge border/shadow — otherwise, when the drawer is closed
           (translated off-screen), its 1px right border / shadow peeks at the
           very left of the screen as a thin grey strip. */
        border-right: 0 !important;
        box-shadow: none !important;
        /* Belt-and-braces: when closed, hide painting entirely so nothing can
           bleed at x=0 regardless of width/border/shadow. Re-shown on nav_open. */
        visibility: hidden;
    }
    html.nav_open .wix-sidebar,
    html.nav_open .sidebar,
    body.nav_open .wix-sidebar,
    body.nav_open .sidebar {
        transform: translateX(0);
        visibility: visible;
        transition: transform .28s ease, visibility 0s linear 0s;
        box-shadow: 0 0 40px rgba(0,0,0,0.25) !important;
    }
    /* The chat page (and others) add body.sidebar-collapsed, which GLOBALLY
       forces the sidebar to a 64px rail (rule further down, outside any media
       query). On mobile that left a 64px bar — really its shadow/border —
       peeking at the screen edge, because translateX(-100%) only shifted it
       64px. Force the full off-canvas width and strip the shadow/border so it
       hides completely. The extra .sidebar-style-2 raises specificity above
       the global collapsed rule regardless of source order; it still opens via
       the hamburger (nav_open). */
    body.sidebar-collapsed .wix-sidebar.sidebar-style-2,
    body.sidebar-collapsed .sidebar.sidebar-style-2 {
        width: 288px !important;
        min-width: 288px !important;
        max-width: 86% !important;
        transform: translateX(-100%);
        box-shadow: none !important;
        border-right: 0 !important;
    }
    html.nav_open body.sidebar-collapsed .wix-sidebar.sidebar-style-2,
    body.nav_open.sidebar-collapsed .wix-sidebar.sidebar-style-2,
    body.nav_open.sidebar-collapsed .sidebar.sidebar-style-2 {
        transform: translateX(0) !important;
    }
    /* Main content always spans the full viewport width on mobile. */
    .main-panel {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
    }
}

.wix-sidebar .sidebar-wrapper {
    background: #F4F4F4 !important;
    padding: 0 !important;
}

.wix-sidebar .sidebar-content {
    background: #F4F4F4 !important;
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

/* Native-scroll middle zone. Header + user box are flex siblings that stay
   fixed; only this scrolls. */
.wix-sidebar .sidebar-wrapper {
    overflow: hidden !important;
}
.wix-sidebar-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: rgba(15, 23, 42, 0.18) transparent;
}
.wix-sidebar-scroll::-webkit-scrollbar { width: 7px; }
.wix-sidebar-scroll::-webkit-scrollbar-thumb { background: rgba(15,23,42,0.16); border-radius: 4px; }

body[data-background-color="dark"] .wix-sidebar-scroll::-webkit-scrollbar-thumb,
.wix-sidebar[data-background-color="dark2"] .wix-sidebar-scroll::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.12);
}

body[data-background-color="dark"] .wix-sidebar-scroll::-webkit-scrollbar-thumb:hover,
.wix-sidebar[data-background-color="dark2"] .wix-sidebar-scroll::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.18);
}

/* "New task" sticks to the top of the scroll zone (Manus-style) — the rest
   of the nav scrolls beneath it. The background must be opaque (it covers
   rows scrolling beneath), so it's themed per mode: light sidebar gray vs
   the dark sidebar surface — a hardcoded light fill read as a white strip
   in dark mode. */
.wix-sidebar-scroll .nav-primary > li:first-child {
    position: sticky;
    top: 0;
    z-index: 5;
    background: #F4F4F4;
}
.wix-sidebar[data-background-color="dark2"] .wix-sidebar-scroll .nav-primary > li:first-child,
body[data-background-color="dark"] .wix-sidebar-scroll .nav-primary > li:first-child {
    background: #000000;
}

/* Sidebar header — logo on the left, action icons on the right.
   Matches the manus reference (brand mark + search + collapse). */
.wix-sidebar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 14px 16px 10px;
    flex-shrink: 0;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.wix-sidebar-header__brand {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none !important;
    color: #18181B !important;
    font: 700 18px/1 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    letter-spacing: -0.02em;
}

.wix-sidebar-header__brand:hover {
    text-decoration: none !important;
    color: #18181B !important;
}

.wix-sidebar-header__brand-dot {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: linear-gradient(135deg, #3d9a6a 0%, #2f7a54 100%);
    box-shadow: none;
    display: inline-block;
    flex-shrink: 0;
}

.wix-sidebar-header__brand-name {
    font-family: inherit;
}

.wix-sidebar-header__actions {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.wix-sidebar-header__btn {
    width: 32px;
    height: 32px;
    border: 0;
    background: transparent;
    color: #535353;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
    font-size: 15px;
}

.wix-sidebar-header__btn:hover {
    background: rgba(0, 0, 0, 0.06);
    color: #18181B;
}

/* The collapse button reuses .wix-sidebar-toggle, which carries margins from
   its old standalone placement — inside the header row they knock it out of
   line with the search button, so reset them here. */
.wix-sidebar-header__actions .wix-sidebar-toggle {
    margin: 0;
}

/* Both header icons share one look — same icon size, color and hover in both
   themes. Without this the toggle picks up .wix-sidebar-toggle's own colors
   (near-black in light, pure white in dark) while the search button keeps the
   base gray, so the pair reads mismatched and slightly off-line. */
.wix-sidebar-header__actions .wix-sidebar-header__btn {
    color: #535353;
}
.wix-sidebar-header__actions .wix-sidebar-header__btn:hover {
    background: rgba(0, 0, 0, 0.06);
    color: #18181B;
}
.wix-sidebar-header__actions .wix-sidebar-header__btn svg {
    width: 17px;
    height: 17px;
    display: block;
}
.wix-sidebar[data-background-color="dark2"] .wix-sidebar-header__actions .wix-sidebar-header__btn {
    color: #d4d4d8;
}
.wix-sidebar[data-background-color="dark2"] .wix-sidebar-header__actions .wix-sidebar-header__btn:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #ffffff;
}

.wix-sidebar .scrollbar-inner>.scroll-element .scroll-bar {
    background: #d9d9d9 !important;
    border-radius: 3px !important;
}

.wix-user-block {
    padding: 20px 16px 16px;
    flex-shrink: 0;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.wix-user-name {
    font-size: 14px;
    font-weight: 600;
    color: #242424;
    margin: 0 0 2px;
}

.wix-user-role {
    font-size: 12px;
    color: #5f5f5f;
    margin: 0 0 6px;
}

.wix-user-link {
    font-size: 12px;
    color: #16a34a !important;
    text-decoration: none !important;
    font-weight: 500;
}

.wix-user-link:hover {
    text-decoration: underline !important;
}

.wix-separator {
    height: 1px;
    background: rgba(0, 0, 0, 0.08);
    margin: 5px 20px;
}

.wix-section-heading {
    font-size: 11.5px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
    color: #727272;
    padding: 8px 18px 4px;
    margin: 0;
}

.wix-sidebar[data-background-color="dark2"] .wix-section-heading {
    color: #727272;
}

/* Collapsible section heading — click toggles, chevron rotates. */
.wix-section-heading--toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    cursor: pointer;
    user-select: none;
    transition: color .15s ease;
}

.wix-section-heading--toggle:hover {
    color: #16a34a;
}

.wix-section-heading__caret {
    font-size: 9px;
    opacity: .65;
    transition: transform .2s ease, opacity .15s ease;
    padding: 4px;
    cursor: pointer;
}

.wix-section-heading--toggle:hover .wix-section-heading__caret {
    opacity: 1;
}

.wix-section-heading--toggle.is-collapsed .wix-section-heading__caret {
    transform: rotate(-90deg);
}

.wix-section-heading__actions {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    flex-shrink: 0;
}

#vaiProjectsList {
    max-height: 224px;
    overflow-y: auto;
}

.wix-sidebar .nav-primary > li.wix-section-body.is-hidden {
    display: none !important;
}

/* ── Inline chat history list ─────────────────────────────────
   Shows the user's recent AI Chat conversations directly in the
   main sidebar. max-height is sized to fit ~10 rows; the rest
   scroll inside the list itself (so the rest of the sidebar
   stays fixed in view). */
.wix-chats-list {
    list-style: none;
    margin: 0 0 4px;
    padding: 0;
    /* No internal scroll — show every chat down the list; the sidebar
       itself scrolls if the whole thing gets too tall. */
}

.wix-chats-list::-webkit-scrollbar {
    width: 6px;
}

.wix-chats-list::-webkit-scrollbar-thumb {
    background: rgba(15, 23, 42, 0.16);
    border-radius: 3px;
}

.wix-chat-item {
    margin: 0;
    position: relative;
}

.wix-chat-item>a {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 1px 8px;
    /* Fixed row height + line-height so every row is identical regardless of
       what the title contains — emoji / Urdu / RTL glyphs have a taller line
       box than plain ASCII and were making some rows bigger than others
       ("koi aadhi koi chhoti"). Vertical centring comes from min-height, not
       padding, and overflow:hidden clips any oversized inline content.
       Compact (Manus-style): tight row pitch, minimal inter-row gap. */
    min-height: 28px;
    padding: 0 30px 0 10px;
    font-size: 13px;
    line-height: 1.2;
    font-weight: 500;
    color: #27272A;
    text-decoration: none;
    border-radius: 10px;
    overflow: hidden;
    transition: background .15s ease, color .15s ease;
}

/* ── Per-row 3-dot menu button (ChatGPT-style: hidden until row hover) ── */
.wix-chat-item__menu-btn {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    border: 0;
    padding: 0;
    border-radius: 6px;
    background: transparent;
    color: #727272;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transition: opacity .12s ease, background .12s ease, color .12s ease;
}

.wix-chat-item:hover .wix-chat-item__menu-btn,
.wix-chat-item.has-menu-open .wix-chat-item__menu-btn {
    opacity: 1;
    pointer-events: auto;
}

.wix-chat-item__menu-btn:hover,
.wix-chat-item.has-menu-open .wix-chat-item__menu-btn {
    background: rgba(0, 0, 0, 0.10);
    color: #18181B;
}

/* Touch devices have no hover — keep the dots tappable at all times. */
@media (hover: none) {
    .wix-chat-item__menu-btn {
        opacity: .7;
        pointer-events: auto;
    }
}

.wix-chat-item>a:hover {
    background: rgba(0, 0, 0, 0.05);
    color: #18181B;
    text-decoration: none;
}

.wix-chat-item.active>a {
    background: transparent;
    color: #1f2024;
    font-weight: 500;
}
.wix-chat-item.active>a:hover {
    background: rgba(0, 0, 0, 0.05);
}

.wix-chat-item__icon {
    /* Fixed-size centered box so every icon (varying FA glyph widths) sits in
       an identical column — icons line up straight and titles align. */
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    line-height: 1;
    color: #727272;
    flex-shrink: 0;
}

.wix-chat-item.active>a .wix-chat-item__icon {
    color: #27272A;
}

.wix-chat-item__title {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wix-chat-item__pin {
    color: #16a34a;
    font-size: 9px;
    flex-shrink: 0;
    display: none;
}

.wix-chat-item.is-pinned .wix-chat-item__pin {
    display: inline-block;
}

.wix-chat-item__fav {
    color: #f5b301;
    font-size: 9px;
    flex-shrink: 0;
    display: none;
}

.wix-chat-item.is-favorite .wix-chat-item__fav {
    display: inline-block;
}

/* A chat the assistant left a question hanging in. The dashed yellow ring
   takes the icon's place — same 16px column, so nothing shifts — and reads as
   unfinished rather than as an error. */
.wix-chat-item__await {
    display: none;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    position: relative;
}

.wix-chat-item__await::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 12px;
    height: 12px;
    border: 1.5px dashed #f5b301;
    border-radius: 50%;
}

.wix-chat-item.is-awaiting .wix-chat-item__await {
    display: inline-block;
}

.wix-chat-item.is-awaiting .wix-chat-item__icon {
    display: none;
}

/* "Archived" toggle pinned under the Tasks list. */
.wix-chats-archtoggle {
    display: flex;
    align-items: center;
    gap: 8px;
    width: calc(100% - 16px);
    margin: 2px 8px 8px;
    padding: 6px 10px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #727272;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}

.wix-chats-archtoggle:hover {
    background: #f4f4f5;
    color: #27272A;
}

.wix-chats-archtoggle i {
    width: 14px;
    text-align: center;
    font-size: 11px;
    flex-shrink: 0;
}

.wix-chats-archtoggle.is-on {
    color: #16a34a;
}

.wix-sidebar[data-background-color="dark2"] .wix-chats-archtoggle {
    color: #a1a1a1;
}

.wix-sidebar[data-background-color="dark2"] .wix-chats-archtoggle:hover {
    background: rgba(255, 255, 255, 0.07);
    color: #ffffff;
}

/* ── Tasks "Filter by" (Manus-style: None / Favourite / Shared) ── */
.wix-tasks-head-li { position: relative; }
.wix-tasks-filter {
    margin-left: auto; flex-shrink: 0;
    border: 0; background: transparent; color: inherit; cursor: pointer;
    padding: 3px 5px; border-radius: 6px; line-height: 0; opacity: .7;
    display: inline-flex; align-items: center;
    transition: opacity .12s ease, background .12s ease, color .12s ease;
}
.wix-tasks-filter i { font-size: 12px; }
.wix-tasks-filter:hover { opacity: 1; background: rgba(0, 0, 0, 0.06); }
.wix-tasks-filter.is-on { color: #16a34a; opacity: 1; }
.wix-tasks-filtermenu {
    position: absolute; top: calc(100% - 2px); right: 6px; z-index: 45;
    min-width: 158px; padding: 5px;
    background: #ffffff; border: 1px solid #e7e7e9; border-radius: 10px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.16);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.wix-tasks-filtermenu[hidden] { display: none !important; }
.wix-tasks-filtermenu__cap {
    margin: 3px 8px 6px; font: 600 10px/1 'Inter', sans-serif;
    letter-spacing: .07em; text-transform: uppercase; color: #9a9a9a;
}
.wix-tasks-filteropt {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    width: 100%; padding: 7px 9px; border: 0; border-radius: 7px; background: transparent;
    color: #27272A; font: 500 12.5px/1 'Inter', sans-serif; text-align: left; cursor: pointer;
}
.wix-tasks-filteropt:hover { background: #f4f4f5; }
.wix-tasks-filteropt i { font-size: 11px; color: #16a34a; opacity: 0; }
.wix-tasks-filteropt.is-active { color: #16a34a; font-weight: 600; }
.wix-tasks-filteropt.is-active i { opacity: 1; }
.wix-sidebar[data-background-color="dark2"] .wix-tasks-filter:hover { background: rgba(255, 255, 255, 0.08); }
.wix-sidebar[data-background-color="dark2"] .wix-tasks-filtermenu { background: #1e1f24; border-color: #3b3b3b; box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5); }
.wix-sidebar[data-background-color="dark2"] .wix-tasks-filtermenu__cap { color: #8a8a8f; }
.wix-sidebar[data-background-color="dark2"] .wix-tasks-filteropt { color: #d7d7d9; }
.wix-sidebar[data-background-color="dark2"] .wix-tasks-filteropt:hover { background: #2c2d33; }
.wix-sidebar[data-background-color="dark2"] .wix-tasks-filteropt.is-active { color: #4ade80; }
.wix-sidebar[data-background-color="dark2"] .wix-tasks-filteropt.is-active i { color: #4ade80; }

/* ── Floating conversation menu (one shared panel, moved to <body>) ── */
.wix-chat-menu {
    position: fixed;
    z-index: 100000;
    min-width: 168px;
    background: #ffffff;
    border: 1px solid #e4e4e7;
    border-radius: 10px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.14), 0 2px 8px rgba(15, 23, 42, 0.08);
    padding: 4px;
    display: none;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.wix-chat-menu.is-open {
    display: block;
}

.wix-chat-menu__item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 5px 8px;
    border: 0;
    background: transparent;
    color: #27272A;
    font-size: 12.5px;
    line-height: 1.25;
    font-weight: 500;
    text-align: left;
    border-radius: 6px;
    cursor: pointer;
}

.wix-chat-menu__item:hover {
    background: #f4f4f5;
}

.wix-chat-menu__item i {
    width: 13px;
    text-align: center;
    font-size: 11.5px;
    color: #727272;
    flex-shrink: 0;
}

.wix-chat-menu__item.is-danger {
    color: #dc2626;
}

.wix-chat-menu__item.is-danger i {
    color: #dc2626;
}

.wix-chat-menu__item.is-danger:hover {
    background: #fee2e2;
}

.wix-chat-menu__sep {
    height: 1px;
    background: #ececef;
    margin: 3px 2px;
}

.wix-chat-menu__item {
    text-decoration: none;
}

/* Label spans stretch; decorative ones (the project colour dot) must not. */
.wix-chat-menu__item>span:not([class]) {
    flex: 1;
    min-width: 0;
}

.wix-chat-menu__item .wix-chat-menu__chev {
    flex: 0 0 auto;
    width: 10px;
    font-size: 10px;
    opacity: .55;
}

/* "Move to project" fly-out. */
.wix-chat-submenu {
    min-width: 190px;
    max-height: 320px;
    overflow-y: auto;
}

.wix-chat-menu__dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #16a34a;
    flex-shrink: 0;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12);
}

.wix-chat-menu__empty {
    padding: 6px 8px;
    font-size: 11.5px;
    color: #a1a1a1;
}

/* Dark theme → dark menu. The panel is moved to <body>, so the sidebar's own
   [data-background-color="dark2"] rules can never reach it; key off <body>
   instead (same approach as .vai-notif-panel above). */
body[data-background-color="dark"] .wix-chat-menu {
    background: #141414 !important;
    border-color: rgba(255, 255, 255, 0.10) !important;
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.6), 0 2px 8px rgba(0, 0, 0, 0.45) !important;
}

body[data-background-color="dark"] .wix-chat-menu__item {
    color: #f0f0f0 !important;
}

body[data-background-color="dark"] .wix-chat-menu__item i {
    color: #a1a1a1 !important;
}

body[data-background-color="dark"] .wix-chat-menu__item:hover {
    background: rgba(255, 255, 255, 0.07) !important;
}

body[data-background-color="dark"] .wix-chat-menu__sep {
    background: rgba(255, 255, 255, 0.09) !important;
}

body[data-background-color="dark"] .wix-chat-menu__item.is-danger,
body[data-background-color="dark"] .wix-chat-menu__item.is-danger i {
    color: #f87171 !important;
}

body[data-background-color="dark"] .wix-chat-menu__item.is-danger:hover {
    background: rgba(239, 68, 68, 0.14) !important;
}

body[data-background-color="dark"] .wix-chat-menu__empty {
    color: #8f8f8f !important;
}

.wix-chats-empty {
    padding: 8px 20px 12px;
    font-size: 11.5px;
    color: #a1a1a1;
    font-style: italic;
}

.wix-sidebar[data-background-color="dark2"] .wix-chat-item>a {
    color: #b0b0b0;
}

.wix-sidebar[data-background-color="dark2"] .wix-chat-item>a:hover,
.wix-sidebar[data-background-color="dark2"] .wix-chat-item.active>a {
    color: #16a34a;
}

.wix-sidebar[data-background-color="dark2"] .wix-chats-empty {
    color: #727272;
}

.wix-sidebar[data-background-color="dark2"] .wix-chat-item__menu-btn {
    color: #ffffff;
}

.wix-sidebar[data-background-color="dark2"] .wix-chat-item__menu-btn:hover,
.wix-sidebar[data-background-color="dark2"] .wix-chat-item.has-menu-open .wix-chat-item__menu-btn {
    background: rgba(255, 255, 255, 0.12);
    color: #e9e9e9;
}

/* Coming-soon nav item — muted text, cursor-not-allowed, faded
   icon. The "Soon" pill on the right communicates state without
   needing extra copy. */
.wix-sidebar .nav-primary .nav-item.is-disabled>a {
    cursor: not-allowed !important;
    color: #a1a1a1 !important;
}

.wix-sidebar .nav-primary .nav-item.is-disabled>a:hover {
    background: rgba(148, 163, 184, 0.06) !important;
    color: #a1a1a1 !important;
    border-left-color: transparent !important;
}

.wix-sidebar .nav-primary .nav-item.is-disabled>a .wix-leading-icon {
    opacity: 0.6;
}

/* ── Agent mode ──────────────────────────────────────────────────────────
   Inside one agent the rail is that agent's: its own rows replace the product
   nav rather than sitting under it. Done by hiding the others instead of
   moving them, so anything added to this nav later is covered automatically —
   and so leaving the agent restores the sidebar exactly as it was.
   .nav-item carries `display:flex !important` further down, hence the
   !important here. */
.wix-sidebar .nav-primary[data-agent-mode] > li:not(.wix-agent-item) { display: none !important; }

/* The agent's name, with the way back out. Reads as a title, not a nav row. */
.wix-sidebar .nav-primary .nav-item.wix-agent-head > a p { font-weight: 650; font-size: 14.5px; }
.wix-sidebar .nav-primary .nav-item.wix-agent-head > a i.wix-leading-icon { font-size: 12.5px; }
/* New Chat is the one action here, so it gets the only outlined row. */
.wix-sidebar .nav-primary .nav-item.wix-agent-new > a {
    border: 1px solid rgba(22,163,74,.35); border-radius: 10px; color: #16a34a;
}
.wix-sidebar .nav-primary .nav-item.wix-agent-new > a:hover { background: rgba(22,163,74,.10); }
.wix-sidebar .nav-primary .nav-item.wix-agent-new > a p { font-weight: 620; }
.wix-sidebar .nav-primary .nav-item.wix-agent-new > a i.wix-leading-icon { color: #16a34a; }

/* The up/down glyph next to the agent's name — the affordance that says this
   row is a switcher, not just a title. */
.wix-sidebar .nav-primary .nav-item.wix-agent-head > a .wix-agent-switch {
    margin-left: auto; font-size: 11px; opacity: .55;
}

/* Recents: find-as-you-type over what the rail is already showing, and a
   filter for the two kinds it mixes. */
.wix-sidebar .nav-primary > li.wix-agent-find {
    position: relative; display: flex !important; gap: 6px; padding: 2px 12px 8px;
}
.wix-agent-search {
    flex: 1 1 auto; min-width: 0; height: 30px; padding: 0 10px;
    border: 1px solid var(--wix-sb-border, #e7e7e9); border-radius: 8px;
    background: transparent; color: inherit; font: inherit; font-size: 12.5px; outline: none;
}
.wix-agent-search:focus { border-color: #16a34a; }
.wix-agent-search::-webkit-search-cancel-button { cursor: pointer; }
.wix-agent-filter {
    width: 30px; height: 30px; flex: 0 0 auto; border-radius: 8px; cursor: pointer;
    border: 1px solid var(--wix-sb-border, #e7e7e9); background: transparent;
    color: inherit; opacity: .7; font-size: 11.5px;
}
.wix-agent-filter:hover, .wix-agent-filter[aria-expanded="true"] { opacity: 1; }
.wix-agent-filtermenu {
    position: absolute; right: 12px; top: 34px; z-index: 30; min-width: 150px;
    padding: 5px; border-radius: 10px;
    border: 1px solid var(--wix-sb-border, #e7e7e9); background: #fff;
    box-shadow: 0 12px 30px rgba(0,0,0,.14);
}
.wix-agent-filteropt {
    display: block; width: 100%; text-align: left; cursor: pointer;
    padding: 7px 9px; border: 0; border-radius: 7px; background: none;
    color: #27272a; font: inherit; font-size: 12.5px;
}
.wix-agent-filteropt:hover { background: #f4f4f5; }
.wix-agent-filteropt.is-on { font-weight: 650; color: #16a34a; }

/* Nothing here yet — a place things will appear, not a failure. */
.wix-agent-empty {
    margin: 4px 12px 2px; padding: 26px 12px; border-radius: 12px;
    border: 1px dashed var(--wix-sb-border, #e0e0e3);
    text-align: center; font-size: 12.5px; opacity: .6;
}

/* Credits, last thing in the rail — the number and the bar that makes it
   mean something at a glance. */

body[data-background-color="dark"] .wix-agent-filtermenu { background: #141416; border-color: #26262b; }
body[data-background-color="dark"] .wix-agent-filteropt { color: #e4e4e7; }
body[data-background-color="dark"] .wix-agent-filteropt:hover { background: #1d1d20; }
body[data-background-color="dark"] .wix-agent-search,
body[data-background-color="dark"] .wix-agent-filter { border-color: #26262b; }
body[data-background-color="dark"] .wix-agent-empty { border-color: #2b2b31; }

/* Collapsed sidebar: the rail's non-row furniture has nowhere to go. */
body.sidebar-collapsed .wix-agent-find,
body.sidebar-collapsed .wix-agent-empty { display: none !important; }

/* Reflections sits under Agents while you are inside one — indented so it
   reads as belonging to the row above rather than as another product area. */
.wix-sidebar .nav-primary .nav-item.wix-agent-sub > a { padding-left: 34px; }
.wix-sidebar .nav-primary .nav-item.wix-agent-sub > a i.wix-leading-icon { font-size: 13px; }
.wix-sidebar .nav-primary .nav-item.wix-agent-sub > a p { font-size: 13.5px; }
body.sidebar-collapsed .wix-sidebar .nav-primary .nav-item.wix-agent-sub > a { padding-left: 0; }
.wix-refl-pip {
    margin-left: auto;
    min-width: 17px;
    height: 17px;
    padding: 0 5px;
    border-radius: 999px;
    background: #16a34a;
    color: #fff;
    font: 700 10px/17px 'Inter', sans-serif;
    text-align: center;
}

.wix-soon-pill {
    margin-left: auto;
    font: 700 9.5px/1 'Inter', sans-serif;
    background: rgba(148, 163, 184, 0.18);
    color: #727272;
    padding: 3px 7px;
    border-radius: 999px;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}

.wix-sidebar[data-background-color="dark2"] .wix-soon-pill {
    background: rgba(168, 175, 201, 0.16);
    color: #b0b0b0;
}

.wix-sidebar .nav-primary .nav-item>a .wix-leading-icon {
    display: inline-block !important;
    margin: 0 !important;
    font-size: 15px;
    width: 16px;
    text-align: center;
    flex-shrink: 0;
    color: inherit !important;
}

/* ── Nav Section Headers (Manus-style grouping) ── */
.nav-section-header {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #8b9098;
    padding: 12px 16px 6px;
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.nav-section-header:first-child {
    margin-top: 0;
}

.nav-section-header i {
    font-size: 10px;
    opacity: 0.7;
}

.nav-section-divider {
    height: 1px;
    background: rgba(255, 255, 255, 0.08);
    margin: 8px 0;
}

body[data-background-color="light"] .nav-section-header {
    color: #8b9098;
}

body[data-background-color="dark"] .nav-section-header,
.wix-sidebar[data-background-color="dark2"] .nav-section-header {
    color: #6b7280;
}

body[data-background-color="dark"] .nav-section-divider,
.wix-sidebar[data-background-color="dark2"] .nav-section-divider {
    background: rgba(255, 255, 255, 0.08);
}

/* ── Tighter nav spacing ── */
.wix-sidebar .nav-primary {
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;   /* never a flex column — stops items
                                    stretching apart with big gaps */
    flex: 0 0 auto !important;
}
.wix-sidebar .nav-primary > li {
    display: block !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
}
.wix-sidebar.sidebar-style-2 .nav.nav-primary > .nav-item > a,
.wix-sidebar .nav.nav-primary > .nav-item > a,
.wix-sidebar .nav-primary .nav-item > a {
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    align-items: center !important;
    line-height: 1 !important;
    padding: 0 10px !important;
    margin: 1px 8px !important;
}
.wix-sidebar.sidebar-style-2 .nav.nav-primary > .nav-item > a .wix-leading-icon,
.wix-sidebar .nav-primary .nav-item > a .wix-leading-icon {
    font-size: 13.5px !important;
    line-height: 1 !important;
    width: 15px !important;
}
.wix-sidebar.sidebar-style-2 .nav.nav-primary > .nav-item > a p,
.wix-sidebar .nav-primary .nav-item > a p {
    line-height: 1 !important;
}

.wix-sidebar .nav-primary .nav-item {
    margin: 0 !important;
    padding: 0 !important;
}

.wix-sidebar .nav-primary .nav-item>a {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    margin: 1px 6px !important;
    padding: 5px 10px !important;
    color: #1f2024 !important;
    font-weight: 500 !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    text-decoration: none !important;
    border-left: 0 !important;
    border-radius: 10px !important;
    background: none !important;
    box-shadow: none !important;
    transition: background .15s ease, color .15s ease !important;
    font-size: 13px !important;
}

.wix-sidebar .nav-primary .nav-item>a:hover {
    background: rgba(0, 0, 0, 0.05) !important;
    color: #18181B !important;
}

/* No persistent active highlight — active row looks like a normal row; only
   :hover shows a background. The selector mirrors atlantis's
   `.sidebar.sidebar-style-2 .nav.nav-primary>.nav-item.active>a {background:#000}`
   plus `.wix-sidebar` so it has higher specificity and kills the black fill. */
.wix-sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a,
.wix-sidebar .nav.nav-primary > .nav-item.active > a,
.wix-sidebar .nav-primary .nav-item.active > a {
    background: transparent !important;
    color: #1f2024 !important;
    font-weight: 500 !important;
    border-left: 0 !important;
    border-radius: 10px !important;
}
.wix-sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a p,
.wix-sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a i {
    color: #1f2024 !important;
}
.wix-sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a:hover,
.wix-sidebar .nav-primary .nav-item.active > a:hover {
    background: rgba(0, 0, 0, 0.05) !important;
}

/* Push trailing chevrons / pills to the right when present. */
.wix-sidebar .nav-primary .nav-item>a .wix-chevron,
.wix-sidebar .nav-primary .nav-item>a .wix-submenu-caret,
.wix-sidebar .nav-primary .nav-item>a .wix-soon-pill {
    margin-left: auto !important;
}

.wix-sidebar .nav-primary .nav-item>a p {
    margin: 0 !important;
    font-size: 13px !important;
}

.wix-sidebar .nav-primary .nav-item>a i:not(.wix-leading-icon):not(.wix-chevron):not(.wix-submenu-caret) {
    display: none !important;
}

.wix-sidebar .nav-primary .nav-item>a .wix-chevron {
    display: block !important;
    font-size: 10px !important;
    color: #727272 !important;
    margin-left: auto;
}

/* Kill atlantis.css's bright-blue active-state pseudo-bar that
   otherwise shows up as a filled blue background on the active row. */
.wix-sidebar .nav-primary .nav-item>a::before,
.wix-sidebar .nav-primary .nav-item.active>a::before,
.wix-sidebar .nav>.nav-item.active>a::before,
.wix-sidebar[data-background-color="white"] .nav>.nav-item.active>a::before {
    display: none !important;
    background: transparent !important;
    content: none !important;
}

.wix-sidebar .nav>.nav-item.active>a,
.wix-sidebar[data-background-color="white"] .nav>.nav-item.active>a {
    color: #18181B !important;
}

.wix-sidebar .nav>.nav-item.active>a p,
.wix-sidebar[data-background-color="white"] .nav>.nav-item.active>a p {
    color: #18181B !important;
}

.wix-sidebar .nav-primary .nav-item:nth-child(n)>a i:not(.wix-leading-icon):not(.wix-chevron):not(.wix-submenu-caret) {
    display: none !important;
}

.wix-sidebar .caret {
    display: none !important;
}

/* Dark Mode */
.wix-sidebar[data-background-color="dark2"] {
    background: #1d1d1d !important;
    border-right-color: #4a4a4f !important;
}

.wix-sidebar[data-background-color="dark2"] .sidebar-wrapper,
.wix-sidebar[data-background-color="dark2"] .sidebar-content {
    background: #1d1d1d !important;
}

.wix-sidebar[data-background-color="dark2"] .wix-user-name {
    color: #ffffff;
}

.wix-sidebar[data-background-color="dark2"] .wix-user-role {
    color: #989898;
}

.wix-sidebar[data-background-color="dark2"] .wix-separator {
    background: #2c2c2c;
}

.wix-sidebar[data-background-color="dark2"] .nav-primary .nav-item>a {
    color: #ffffff !important;
}

.wix-sidebar[data-background-color="dark2"] .nav-primary .nav-item>a:hover {
    background: rgba(255, 255, 255, 0.04) !important;
}

/* Atlantis dark2 style-2 paints active rows with `background:#fff` + dark
   text. Our earlier white-text overrides then made "AI Agent" (etc.) a blank
   white bar. Beat atlantis specificity and keep a calm dark active state. */
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav.nav-primary > .nav-item.active > a,
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav.nav-primary > .nav-item.active > a:hover,
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav.nav-primary > .nav-item.active > a:focus,
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav .nav-item.active > a,
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav .nav-item.active > a:hover,
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav .nav-item.active > a:focus,
.wix-sidebar[data-background-color="dark2"] .nav-primary .nav-item.active > a {
    background: rgba(255, 255, 255, 0.06) !important;
    color: #ffffff !important;
    border-left-color: transparent !important;
    box-shadow: none !important;
}
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav.nav-primary > .nav-item.active > a p,
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav.nav-primary > .nav-item.active > a i,
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav.nav-primary > .nav-item.active > a .caret,
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav.nav-primary > .nav-item.active > a span,
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav .nav-item.active > a p,
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav .nav-item.active > a i,
.wix-sidebar[data-background-color="dark2"].sidebar-style-2 .nav .nav-item.active > a .caret,
.wix-sidebar[data-background-color="dark2"] .nav > .nav-item.active > a,
.wix-sidebar[data-background-color="dark2"] .nav > .nav-item.active > a p {
    color: #ffffff !important;
}
/* Also cover body-driven dark (in case sidebar attr lags behind theme sync). */
body[data-background-color="dark"] .wix-sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a,
body[data-background-color="dark"] .wix-sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a:hover,
body[data-background-color="dark"] .wix-sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a:focus {
    background: rgba(255, 255, 255, 0.06) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}
body[data-background-color="dark"] .wix-sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a p,
body[data-background-color="dark"] .wix-sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a i {
    color: #ffffff !important;
}

.wix-sidebar[data-background-color="dark2"] .nav-primary .nav-item>a .wix-chevron {
    color: #727272 !important;
}

/* ── Collapsible submenu (Themes) ── */
.wix-sidebar .nav-primary .nav-item .wix-submenu {
    list-style: none;
    padding: 2px 0;
    margin: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.25s ease;
    background: transparent;
}

.wix-sidebar .nav-primary .nav-item.has-submenu.is-open>.wix-submenu {
    max-height: 240px;
}

.wix-sidebar .nav-primary .nav-item .wix-submenu li {
    margin: 0;
    padding: 0;
}

.wix-sidebar .nav-primary .nav-item .wix-submenu li>a {
    display: flex !important;
    align-items: center !important;
    margin: 1px 10px !important;
    padding: 7px 14px 7px 40px !important;
    color: #27272A !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    border-left: 0 !important;
    border-radius: 8px !important;
    background: none !important;
}

.wix-sidebar .nav-primary .nav-item .wix-submenu li>a:hover {
    background: rgba(0, 0, 0, 0.05) !important;
    color: #18181B !important;
}

.wix-sidebar .nav-primary .nav-item .wix-submenu li.active>a {
    color: #18181B !important;
    font-weight: 600 !important;
    background: rgba(0, 0, 0, 0.08) !important;
}

.wix-sidebar .nav-primary .nav-item .wix-submenu-caret {
    display: inline-block !important;
    font-size: 10px !important;
    color: #5f5f5f !important;
    margin-left: auto;
    transition: transform 0.25s ease;
}

.wix-sidebar .nav-primary .nav-item.has-submenu.is-open>a .wix-submenu-caret {
    transform: rotate(90deg);
}

/* Submenu — dark mode. No surface of its own: the old #1a1a1a slab sat
   visibly lighter than the #0e1012 sidebar and read as a stray gray block.
   Rows blend with the sidebar like every other item; text sits at the same
   dim level as the chat's secondary text and brightens on hover. */
.wix-sidebar[data-background-color="dark2"] .nav-primary .nav-item .wix-submenu {
    background: transparent !important;
}

.wix-sidebar[data-background-color="dark2"] .nav-primary .nav-item .wix-submenu li>a {
    color: #b8bcc2 !important;
}

.wix-sidebar[data-background-color="dark2"] .nav-primary .nav-item .wix-submenu li>a:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
}

.wix-sidebar[data-background-color="dark2"] .nav-primary .nav-item .wix-submenu li.active>a {
    color: #6bbf8e !important;
    background: rgba(61, 154, 106, 0.12) !important;
    border-left-color: #3d9a6a !important;
}

.wix-sidebar[data-background-color="dark2"] .nav-primary .nav-item .wix-submenu-caret {
    color: #727272 !important;
}

/* ── Sidebar toggle (top of nav) ──────────────────────────
   Replaces the dashboard-nav toggle that used to live in the chat
   page header. Only meaningful on the chat page (only there does
   CSS read the `chat-dashnav-open` class on <html>), but kept
   visible everywhere so the visual is consistent. */
.wix-sidebar-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin: 11px 0 6px;
    padding: 0;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 8px;
    color: #27272A;
    cursor: pointer;
    margin-left: auto;
    margin-right: 5px;

    transition: background .15s ease, color .15s ease, border-color .15s ease;
}

.wix-sidebar-toggle:hover {
    background: rgba(0, 0, 0, 0.05);
    border-color: rgba(0, 0, 0, 0.08);
    color: #18181B;
}

.wix-sidebar-toggle:focus-visible {
    outline: 2px solid #16a34a;
    outline-offset: 2px;
}

.wix-sidebar-toggle svg {
    display: block;
}

.wix-sidebar[data-background-color="dark2"] .wix-sidebar-toggle {
    color: #ffffff;
}

.wix-sidebar[data-background-color="dark2"] .wix-sidebar-toggle:hover {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

/* ── Sidebar rail mode ────────────────────────────────────────
   Toggling body.sidebar-collapsed shrinks the sidebar into a narrow
   rail (icons only, no labels). The toggle button stays visible
   inside the rail so the user can expand it back. */
body.sidebar-collapsed .wix-sidebar {
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
}

body.sidebar-collapsed .main-panel {
    width: calc(100% - 64px) !important;
}

body.sidebar-collapsed .wix-sidebar .nav-primary .nav-item>a .wix-chevron,
body.sidebar-collapsed .wix-sidebar .nav-primary .nav-item>a .wix-submenu-caret,
body.sidebar-collapsed .wix-sidebar .nav-primary .nav-item>a .wix-soon-pill,
body.sidebar-collapsed .wix-sidebar .wix-section-heading,
body.sidebar-collapsed .wix-sidebar .wix-separator,
body.sidebar-collapsed .wix-sidebar .wix-submenu,
body.sidebar-collapsed .wix-sidebar .wix-chats-list,
body.sidebar-collapsed .wix-sidebar .wix-chats-empty,
body.sidebar-collapsed .wix-sidebar #vaiSidebarChatsBody,
body.sidebar-collapsed .wix-sidebar #vaiSidebarChatsHead,
body.sidebar-collapsed .wix-sidebar #vaiSidebarProjectsBody,
body.sidebar-collapsed .wix-sidebar #vaiSidebarProjectsHead,
/* Rail: hide the search. The brand stays (it's the default top icon) and the
   collapse toggle is revealed on hover, so the user can still expand. */
body.sidebar-collapsed .wix-sidebar .wix-sidebar-header__btn--search {
    display: none !important;
}

body.sidebar-collapsed .wix-sidebar .wix-sidebar-header {
    position: relative !important;
    height: 62px;
    padding: 12px 0 6px !important;
    justify-content: center !important;
}

/* Rail top slot: the Volnyn mark sits here by default; hovering (or keyboard-
   focusing) the header cross-fades it into the collapse toggle — same 44px
   tile, same spot, so the button appears exactly where it does today. */
body.sidebar-collapsed .wix-sidebar .wix-sidebar-header__brand,
body.sidebar-collapsed .wix-sidebar .wix-sidebar-header__actions {
    position: absolute;
    top: 12px;
    left: 50%;
    transform: translateX(-50%);
    margin: 0 !important;
    width: 44px;
    height: 44px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    /* No delay on the way OUT, so moving the cursor away restores the logo
       promptly. The delay is added only on :hover below. */
    transition: opacity .18s ease, transform .18s ease;
}

/* The brand asset is a wide wordmark (1202x280), so in the 44px rail tile we
   crop it down to just its shield mark — same trick the chat bot avatar uses
   (object-fit:cover + object-position:left). No separate icon asset needed. */
body.sidebar-collapsed .wix-sidebar .wix-sidebar-header__brand img {
    width: 22px !important;
    height: 22px !important;
    object-fit: cover;
    object-position: left center;
    border-radius: 6px;
}

body.sidebar-collapsed .wix-sidebar .wix-sidebar-header__actions {
    opacity: 0;
    pointer-events: none;
    transform: translateX(-50%) scale(.86);
}

/* Hover/focus: hold for a beat, then cross-fade. The delay stops the button
   from snapping in the instant the cursor touches the rail (and keeps a quick
   pass-through from flickering). */
body.sidebar-collapsed .wix-sidebar .wix-sidebar-header:hover .wix-sidebar-header__brand,
body.sidebar-collapsed .wix-sidebar .wix-sidebar-header:focus-within .wix-sidebar-header__brand {
    opacity: 0;
    pointer-events: none;
    transform: translateX(-50%) scale(.86);
    transition: opacity .24s ease .18s, transform .24s ease .18s;
}

body.sidebar-collapsed .wix-sidebar .wix-sidebar-header:hover .wix-sidebar-header__actions,
body.sidebar-collapsed .wix-sidebar .wix-sidebar-header:focus-within .wix-sidebar-header__actions {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(-50%) scale(1);
    transition: opacity .24s ease .18s, transform .24s cubic-bezier(.2, .8, .2, 1) .18s;
}

/* Right after the toggle collapses the sidebar the cursor is still parked on
   the header, so :hover would keep the button showing and the logo hidden
   until the pointer moves. `is-hover-off` (added on click, cleared on
   mouseleave) snaps the logo back immediately. MUST stay after the :hover
   rules — same specificity, so source order wins.
   The button stays click-through (pointer-events:auto) while invisible so a
   second click re-opens the sidebar instead of following the logo's link. */
body.sidebar-collapsed .wix-sidebar .wix-sidebar-header.is-hover-off .wix-sidebar-header__brand {
    opacity: 1;
    pointer-events: none;
    transform: translateX(-50%) scale(1);
    transition: opacity .16s ease, transform .16s ease;
}

body.sidebar-collapsed .wix-sidebar .wix-sidebar-header.is-hover-off .wix-sidebar-header__actions {
    opacity: 0;
    pointer-events: auto;
    transform: translateX(-50%) scale(.86);
    transition: opacity .16s ease, transform .16s ease;
}

/* Each nav item becomes a clean, equal-sized rounded tile, centered in
   the rail — so hover/active states are neat squares instead of bare
   icons or a wide black bar. */
body.sidebar-collapsed .wix-sidebar .nav-primary .nav-item>a {
    justify-content: center !important;
    gap: 0 !important;
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    margin: 5px auto !important;
    border-radius: 12px !important;
}

/* ── Rail tooltips ───────────────────────────────────────────────────
   In the rail an icon is all you get, and several of these icons are not
   self-evident (Space, Workspace, Automations all read as "some square").
   Rather than add a title attribute — which waits a second and renders in
   the OS style — the label that is already in the markup is reused: it
   moves out of the flow and becomes a chip beside the tile on hover.
   The scroll container has to stop clipping for that chip to escape the
   64px rail; safe here because the collapsed rail hides the long lists
   (Tasks, chats) that made it scroll in the first place. */
body.sidebar-collapsed .wix-sidebar .wix-sidebar-scroll {
    overflow: visible !important;
}
body.sidebar-collapsed .wix-sidebar .nav-primary .nav-item { position: relative; }
body.sidebar-collapsed .wix-sidebar .nav-primary .nav-item>a p {
    position: absolute;
    left: calc(100% - 6px);
    top: 50%;
    transform: translateY(-50%) translateX(-4px);
    margin: 0 !important;
    padding: 6px 10px;
    white-space: nowrap;
    border-radius: 9px;
    background: #1c1c1f;
    border: 1px solid rgba(255,255,255,0.10);
    box-shadow: 0 10px 28px rgba(0,0,0,0.55);
    color: #f1f1f2;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1;
    opacity: 0;
    pointer-events: none;
    z-index: 60;
    transition: opacity .14s ease, transform .14s ease;
}
body:not([data-background-color="dark"]).sidebar-collapsed .wix-sidebar .nav-primary .nav-item>a p {
    background: #ffffff;
    border-color: rgba(0,0,0,0.10);
    color: #18181b;
    box-shadow: 0 10px 28px rgba(15,23,42,0.16);
}
body.sidebar-collapsed .wix-sidebar .nav-primary .nav-item>a:hover p,
body.sidebar-collapsed .wix-sidebar .nav-primary .nav-item>a:focus-visible p {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

/* The referral tile joins the rail as the same 44px square the nav uses,
   instead of a wider rounded box that sat a few pixels proud of them. */
body.sidebar-collapsed .wix-sidebar .vai-ref-card {
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    margin: 0 auto 10px !important;
    border-radius: 12px !important;
}

body.sidebar-collapsed .wix-sidebar .nav-primary .nav-item>a .wix-leading-icon {
    font-size: 18px;
    width: auto;
    margin: 0 !important;
}

/* Toggle button: same 44px centered tile as the nav icons. Margins are 0 —
   the header slot above already positions it. */
body.sidebar-collapsed .wix-sidebar .wix-sidebar-toggle {
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-self: center !important;
}

/* ── Manus-style top: the brand logo now lives at the very top of the
   sidebar, so the old full-width top logo-header is removed and the
   sidebar fills from the top. Scoped automatically — this stylesheet only
   loads on pages that include the side-navbar. The credits pill in the
   right-hand navbar-header stays put. */
/* Remove the entire old top header bar (logo-header + navbar-header). The
   brand logo now lives at the top of the sidebar (Manus-style). */
.main-header {
    display: none !important;
}

/* Atlantis pushes both the sidebar and the main content down by 62px to
   clear that header. It's gone now, so pull them both flush to the top —
   sidebar logo at y0, content fills the viewport. */
.wix-sidebar,
.sidebar {
    top: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.wix-sidebar .sidebar-wrapper {
    padding-top: 0 !important;
    /* Atlantis caps this wrapper at calc(100vh - 75px) with a 100px bottom
       padding, which leaves an empty strip below the user box. Force it to
       fill the full sidebar height so the user box sits flush at the bottom. */
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    padding-bottom: 0 !important;
}

/* Kill the horizontal scrollbar in the sidebar — nothing should scroll
   sideways; clip the few stray pixels instead. */
/* Clip horizontal overflow on the outer containers + the scroll zone only.
   NOT on .nav-primary — overflow-x there turns the <ul> into its own scroll
   box and breaks the sticky "New task". */
.wix-sidebar,
.wix-sidebar .sidebar-wrapper,
.wix-sidebar .sidebar-content {
    overflow-x: hidden !important;
    max-width: 100% !important;
}
.wix-sidebar .scroll-element.scroll-x,
.wix-sidebar .scroll-element.scroll-x .scroll-bar {
    display: none !important;
}

.main-panel > .content,
.main-panel > .content-full {
    margin-top: 0 !important;
}

/* ── User profile box (pinned to the sidebar bottom) ──────────
   Replaces the old top-right avatar dropdown: avatar + name + plan,
   an Upgrade button, and a popup menu (profile / wallet / theme /
   logout). margin-top:auto pins it to the bottom when the nav fits;
   it scrolls with the list otherwise. */
.wix-userbox {
    position: relative;
    /* margin: 8px 10px 12px; */
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    background: #ffffff;
    border: 1px solid #ebebeb;
    /* border-radius: 12px; */
    flex-shrink: 0;
}
.wix-userbox__main {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1 1 auto;
    min-width: 0;
    border: 0;
    background: transparent;
    padding: 0;
    cursor: pointer;
    text-align: left;
}
.wix-userbox__avatar {
    width: 34px; height: 34px;
    border-radius: 50%;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #16a34a, #15803d);
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    overflow: hidden;
}
.wix-userbox__avatar img { width: 100%; height: 100%; object-fit: cover; }
.wix-userbox__info { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.wix-userbox__name {
    font-size: 13px; font-weight: 600; color: #18181B;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.wix-userbox__plan { font-size: 11.5px; color: #727272; }
.wix-userbox__actions { display: flex; align-items: center; gap: 2px; flex-shrink: 0; }
.wix-userbox__act {
    width: 30px; height: 30px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 0; background: transparent; color: #727272;
    border-radius: 8px; cursor: pointer; text-decoration: none;
    transition: background .15s ease, color .15s ease;
}
.wix-userbox__act:hover { background: #f0f0f1; color: #18181B; }

/* ── Notifications bell + dropdown (client-side; window.VaiNotify) ── */
.vai-notif-bell { position: relative; }
.vai-notif-badge {
    position: absolute; top: 1px; right: 1px;
    min-width: 15px; height: 15px; padding: 0 4px;
    display: inline-flex; align-items: center; justify-content: center;
    background: #ef4444; color: #fff;
    font-size: 9px; font-weight: 700; line-height: 1;
    border-radius: 999px; border: 1.5px solid #fff;
    pointer-events: none;
}
.vai-notif-panel {
    position: absolute;
    left: 0; right: 0;
    bottom: calc(100% + 8px);
    background: #ffffff;
    border: 1px solid #ebebeb;
    border-radius: 12px;
    box-shadow: 0 14px 34px rgba(15,23,42,0.14), 0 2px 8px rgba(15,23,42,0.08);
    display: none;
    z-index: 100060;
    overflow: hidden;
}
.vai-notif-panel.is-open { display: block; animation: wixMenuIn .16s ease; }
.vai-notif-panel__head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 13px; border-bottom: 1px solid #F1F1F3;
}
.vai-notif-panel__title { font-size: 12.5px; font-weight: 700; color: #18181B; }
.vai-notif-panel__clear {
    border: 0; background: transparent; color: #16a34a;
    font-size: 11.5px; font-weight: 600; cursor: pointer; padding: 2px 4px;
}
.vai-notif-panel__clear:hover { text-decoration: underline; }
.vai-notif-list { max-height: 340px; overflow-y: auto; padding: 4px; }
.vai-notif-empty {
    padding: 26px 16px; text-align: center; color: #a2a2a2; font-size: 12px;
}
.vai-notif-item {
    position: relative;
    display: flex; gap: 10px; padding: 9px 10px; color: inherit;
    border-radius: 9px; text-decoration: none;
    cursor: pointer; transition: background .12s ease;
}
.vai-notif-item + .vai-notif-item { margin-top: 1px; }
.vai-notif-item:hover { background: #F4F6F5; }
.vai-notif-item.is-unread { background: #F0FAF4; }
.vai-notif-item.is-unread:hover { background: #E7F6EE; }
/* Rounded icon avatar */
.vai-notif-item__icon {
    width: 30px; height: 30px; flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 8px; background: #E7F6EE; color: #16a34a;
}
.vai-notif-item__icon svg { width: 15px; height: 15px; }
.vai-notif-item.is-read .vai-notif-item__icon { background: #F1F2F4; color: #a2a2a2; }
.vai-notif-item__body { min-width: 0; flex: 1; padding-right: 10px; }
.vai-notif-item__title { font-size: 12px; font-weight: 600; color: #18181B; margin: 0 0 1px; line-height: 1.35; }
.vai-notif-item__text { font-size: 11px; color: #6f6f6f; line-height: 1.4; margin: 0; word-break: break-word; }
.vai-notif-item__time { font-size: 10px; color: #a2a2a2; margin-top: 3px; }
/* Unread dot, top-right */
.vai-notif-item__unread {
    position: absolute; top: 12px; right: 10px;
    width: 7px; height: 7px; border-radius: 50%; background: #16a34a;
}
.vai-notif-item.is-read .vai-notif-item__unread { display: none; }

/* Dark theme → dark notifications panel (the popup was hardcoded white). */
body[data-background-color="dark"] .vai-notif-panel {
    background: #141414 !important;
    border-color: rgba(255,255,255,0.10) !important;
    box-shadow: 0 14px 34px rgba(0,0,0,0.6), 0 2px 8px rgba(0,0,0,0.45) !important;
}
body[data-background-color="dark"] .vai-notif-panel__head { border-bottom-color: rgba(255,255,255,0.08) !important; }
body[data-background-color="dark"] .vai-notif-panel__title { color: #f4f4f5 !important; }
body[data-background-color="dark"] .vai-notif-empty { color: #8f8f8f !important; }
body[data-background-color="dark"] .vai-notif-item:hover { background: rgba(255,255,255,0.06) !important; }
body[data-background-color="dark"] .vai-notif-item.is-unread { background: rgba(22,163,74,0.13) !important; }
body[data-background-color="dark"] .vai-notif-item.is-unread:hover { background: rgba(22,163,74,0.20) !important; }
body[data-background-color="dark"] .vai-notif-item__icon { background: rgba(22,163,74,0.16) !important; }
body[data-background-color="dark"] .vai-notif-item.is-read .vai-notif-item__icon { background: rgba(255,255,255,0.08) !important; color: #9a9a9a !important; }
body[data-background-color="dark"] .vai-notif-item__title { color: #f0f0f0 !important; }
body[data-background-color="dark"] .vai-notif-item__text { color: #b4b4b4 !important; }
body[data-background-color="dark"] .vai-notif-item__time { color: #8a8a8a !important; }

/* ── Credits-exhausted popup (center modal) ── */
.vai-credits-modal {
    position: fixed; inset: 0; z-index: 100090;
    display: none; align-items: center; justify-content: center; padding: 20px;
}
.vai-credits-modal.is-open { display: flex; animation: vaiCmFade .18s ease; }
.vai-credits-modal__backdrop {
    position: absolute; inset: 0;
    background: rgba(15,23,42,0.55); backdrop-filter: blur(3px);
}
.vai-credits-modal__card {
    position: relative; width: 100%; max-width: 420px;
    background: #fff; border-radius: 18px;
    box-shadow: 0 24px 60px rgba(15,23,42,0.30);
    padding: 30px 26px 24px; text-align: center;
    animation: vaiCmPop .2s ease;
}
@keyframes vaiCmFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes vaiCmPop { from { opacity: 0; transform: translateY(10px) scale(.97); } to { opacity: 1; transform: none; } }
.vai-credits-modal__icon {
    width: 60px; height: 60px; margin: 0 auto 16px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%; background: #FEF3C7; color: #D97706;
}
.vai-credits-modal__title { font-size: 19px; font-weight: 800; color: #171717; margin: 0 0 8px; }
.vai-credits-modal__text { font-size: 13.5px; color: #6f6f6f; line-height: 1.6; margin: 0 0 22px; }
.vai-credits-modal__actions { display: flex; flex-direction: column; gap: 10px; }
.vai-credits-modal__upgrade {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    background: linear-gradient(135deg, #16a34a, #15803d); color: #fff;
    font-size: 14px; font-weight: 700; text-decoration: none;
    padding: 13px 18px; border-radius: 12px; border: 0; cursor: pointer;
    transition: filter .15s ease, transform .1s ease;
}
.vai-credits-modal__upgrade:hover { filter: brightness(1.06); color: #fff; }
.vai-credits-modal__upgrade:active { transform: scale(.98); }
.vai-credits-modal__dismiss {
    background: transparent; border: 0; color: #6f6f6f;
    font-size: 13px; font-weight: 600; cursor: pointer; padding: 8px;
}
.vai-credits-modal__dismiss:hover { color: #171717; }

/* Popup menu — floats above the box. */
.wix-usermenu {
    position: absolute;
    left: 0; right: 0;
    bottom: calc(100% + 8px);
    background: #ffffff;
    border: 1px solid #ebebeb;
    border-radius: 12px;
    box-shadow: 0 14px 34px rgba(15,23,42,0.14), 0 2px 8px rgba(15,23,42,0.08);
    padding: 6px;
    display: none;
    z-index: 100050;
}
.wix-userbox.is-open .wix-usermenu { display: block; animation: wixMenuIn .16s ease; }
@keyframes wixMenuIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

/* Menu header — avatar + name + account type */
.wix-usermenu__head {
    display: flex; align-items: center; gap: 9px;
    padding: 7px 8px 8px;
}
.wix-usermenu__head-avatar {
    width: 30px; height: 30px; border-radius: 50%; flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #16a34a, #15803d);
    color: #fff; font-weight: 700; font-size: 13px; overflow: hidden;
}
.wix-usermenu__head-avatar img { width: 100%; height: 100%; object-fit: cover; }
.wix-usermenu__head-info { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.wix-usermenu__head-name { font-size: 12.5px; font-weight: 700; color: #18181B; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wix-usermenu__head-sub { font-size: 11px; color: #727272; }

/* Plan card — plan name + Upgrade, then a Credits row (Manus: bordered card) */
.wix-usermenu__plan {
    background: #ffffff;
    border: 1px solid #ebebeb;
    border-radius: 10px;
    padding: 7px 10px;
    margin: 0 2px 6px;
}
.wix-usermenu__plan-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.wix-usermenu__plan-name { font-size: 13px; font-weight: 700; color: #18181B; }
.wix-usermenu__upgrade {
    display: inline-flex; align-items: center;
    background: #18181B; color: #fff !important;
    font-size: 11.5px; font-weight: 600;
    padding: 4px 11px; border-radius: 999px;
    text-decoration: none !important;
    transition: background .15s ease;
}
.wix-usermenu__upgrade:hover { background: #000; }
.wix-usermenu__credits {
    display: flex; align-items: center; justify-content: space-between;
    width: 100%;
    margin-top: 7px; padding: 7px 0 0;
    border: 0; border-top: 1px solid #ebebeb;
    background: transparent;
    text-align: left; cursor: pointer;
    text-decoration: none !important;
    font-family: inherit;
    font-size: 12px; font-weight: 500; color: #27272A;
}
.wix-usermenu__credits:hover .wix-usermenu__credits-val { color: #16a34a; }
.wix-usermenu__credits-left { display: flex; align-items: center; gap: 8px; }
.wix-usermenu__credits-left svg { color: #535353; }
.wix-usermenu__credits-val { display: flex; align-items: center; gap: 6px; color: #18181B; font-weight: 600; }
.wix-usermenu__credits-val i { font-size: 10px; color: #a2a2a2; }
.wix-usermenu__credits:hover .wix-usermenu__credits-val i { color: #18181B; }

/* Small "(?)" info icon next to a label (visual only — tooltip on hover) */
.wix-usermenu__info { margin-left: -2px; font-size: 11px !important; color: #bbbbbb !important; cursor: help; }

/* External-link arrow pushed to the right */
.wix-usermenu__ext { margin-left: auto; font-size: 11px !important; color: #a2a2a2 !important; }

.wix-usermenu__item {
    display: flex; align-items: center; gap: 9px;
    padding: 6px 9px;
    border-radius: 8px;
    font-size: 12.5px; font-weight: 500;
    color: #27272A;
    text-decoration: none;
}
.wix-usermenu__item i { width: 14px; text-align: center; color: #727272; font-size: 12px; }
.wix-usermenu__item:hover { background: #f4f4f5; color: #18181B; }
.wix-usermenu__item--danger { color: #dc2626; }
.wix-usermenu__item--danger i { color: #dc2626; }
.wix-usermenu__item--danger:hover { background: #fee2e2; color: #b91c1c; }
.wix-usermenu__theme {
    display: flex; align-items: center; justify-content: space-between;
    padding: 6px 9px; font-size: 12.5px; font-weight: 500; color: #27272A;
}
.wix-usermenu__theme > span { display: flex; align-items: center; gap: 9px; }
.wix-usermenu__theme > span i { width: 14px; text-align: center; color: #727272; font-size: 12px; }
.wix-usermenu__toggle { display: flex; gap: 4px; margin: 0; }
.wix-usermenu__toggle label { margin: 0; cursor: pointer; }
.wix-usermenu__toggle input { position: absolute; opacity: 0; pointer-events: none; }
.wix-usermenu__toggle span {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 24px; border-radius: 7px;
    border: 1px solid #ebebeb; background: #fff; color: #727272; font-size: 12px;
}
.wix-usermenu__toggle input:checked + span { background: #16a34a; border-color: #16a34a; color: #fff; }
.wix-usermenu__sep { height: 1px; background: #ECECEF; margin: 3px 2px; }

/* ── Workspace switcher (Manus flow) ─────────────────────────────
   The menu head is a button; clicking it opens a side popover listing
   Personal ✓ plus the team (or "+ Create a team" → Team plan modal). */
.wix-usermenu__head--switch {
    width: 100%; border: 0; background: transparent; text-align: left;
    cursor: pointer; border-radius: 10px; font: inherit;
    transition: background .12s ease;
}
.wix-usermenu__head--switch:hover { background: #f4f4f5; }
.wix-usermenu__head-chev {
    margin-left: auto; font-size: 10px; color: #a2a2a2;
    transition: transform .15s ease;
}
.wix-usermenu__head--switch[aria-expanded="true"] .wix-usermenu__head-chev { transform: rotate(90deg); }
.wix-wsmenu {
    /* Fixed + body-appended (JS moves it there on first open): the sidebar
       clips/stacks anything positioned inside it, which left this submenu
       "open" in the DOM but invisible on screen. */
    position: fixed; z-index: 100095;
    min-width: 220px; background: #fff; border: 1px solid #E4E4E7;
    border-radius: 12px; box-shadow: 0 16px 44px rgba(0,0,0,.16); padding: 5px;
}
.wix-wsmenu[hidden] { display: none; }
.wix-wsmenu__row {
    display: flex; align-items: center; gap: 10px; width: 100%;
    border: 0; background: transparent; text-align: left; cursor: pointer;
    padding: 8px 9px; border-radius: 9px; font: inherit; text-decoration: none !important;
}
.wix-wsmenu__row:hover { background: #f4f4f5; text-decoration: none !important; }
.wix-wsmenu__info { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.wix-wsmenu__name { font-size: 12.5px; font-weight: 650; color: #18181B; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wix-wsmenu__sub { font-size: 11px; color: #727272; }
.wix-wsmenu__check { margin-left: auto; font-size: 11px; color: #18181B; }
.wix-wsmenu__gear {
    margin-left: 6px; width: 22px; height: 22px; border-radius: 7px; flex: none;
    display: inline-flex; align-items: center; justify-content: center;
    color: #8a8a8e; font-size: 11px; text-decoration: none !important;
}
.wix-wsmenu__gear:hover { background: #ececee; color: #18181B; }
.wix-wsmenu__sep { height: 1px; background: #ECECEF; margin: 4px 2px; }
.wix-wsmenu__teamic {
    width: 28px; height: 28px; border-radius: 8px; flex: none;
    background: #f4f4f5; color: #52525B; display: inline-flex;
    align-items: center; justify-content: center; font-size: 12px;
}
body[data-background-color="dark"] .wix-usermenu__head--switch:hover { background: #1c1c1f; }
body[data-background-color="dark"] .wix-wsmenu { background: #141416; border-color: #303036; box-shadow: 0 16px 44px rgba(0,0,0,.55); }
body[data-background-color="dark"] .wix-wsmenu__row:hover { background: #1c1c1f; }
body[data-background-color="dark"] .wix-wsmenu__name { color: #f4f4f5; }
body[data-background-color="dark"] .wix-wsmenu__sub { color: #9d9da3; }
body[data-background-color="dark"] .wix-wsmenu__check { color: #f4f4f5; }
body[data-background-color="dark"] .wix-wsmenu__gear { color: #9d9da3; }
body[data-background-color="dark"] .wix-wsmenu__gear:hover { background: #1c1c1f; color: #f4f4f5; }
body[data-background-color="dark"] .wix-wsmenu__sep { background: #26262b; }
body[data-background-color="dark"] .wix-wsmenu__teamic { background: #1c1c1f; color: #c9c9cf; }

/* ── Team plan modal (Manus-style) ─────────────────────────────── */
.vn-team-modal { position: fixed; inset: 0; z-index: 100085; display: flex; align-items: center; justify-content: center; }
.vn-team-modal[hidden] { display: none; }
.vn-team-modal__bd {
    position: absolute; inset: 0; background: rgba(0,0,0,.55);
    opacity: 0; transition: opacity .28s ease;
}
.vn-team-modal__card {
    position: relative; width: min(470px, calc(100vw - 32px)); max-height: min(86vh, 760px);
    overflow-y: auto; background: #ffffff; color: #18181B;
    border: 1px solid #E4E4E7; border-radius: 16px; padding: 20px 20px 18px;
    box-shadow: 0 28px 70px rgba(0,0,0,.35);
    font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    opacity: 0; transform: translateY(18px) scale(.95);
    transition: transform .36s cubic-bezier(.2,.85,.25,1), opacity .28s ease;
}
.vn-team-modal.is-open .vn-team-modal__bd { opacity: 1; }
.vn-team-modal.is-open .vn-team-modal__card { opacity: 1; transform: translateY(0) scale(1); }
@media (prefers-reduced-motion: reduce) {
    .vn-team-modal__bd, .vn-team-modal__card { transition: none; }
}
.vn-team-modal__hd { display: flex; align-items: center; justify-content: space-between; margin: 0 0 14px; }
.vn-team-modal__hd h3 { margin: 0; font-size: 17px; font-weight: 750; letter-spacing: -.02em; }
.vn-team-modal__x { border: 0; background: transparent; color: #727272; font-size: 16px; cursor: pointer; width: 30px; height: 30px; border-radius: 8px; }
.vn-team-modal__x:hover { background: #f4f4f5; color: #18181B; }
.vn-team-modal__cycles { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; }
.vn-team-cycle {
    position: relative; border: 1.5px solid #E4E4E7; border-radius: 12px;
    background: transparent; padding: 12px 13px; text-align: left; cursor: pointer; font: inherit; color: inherit;
}
.vn-team-cycle.is-on { border-color: #16a34a; background: rgba(22,163,74,.06); }
.vn-team-cycle__price { font-size: 17px; font-weight: 750; letter-spacing: -.02em; display: block; margin: 6px 0 2px; }
.vn-team-cycle__per { font-size: 12px; color: #727272; }
.vn-team-cycle__save {
    position: absolute; top: 8px; right: 8px; font-size: 10.5px; font-weight: 700;
    background: rgba(22,163,74,.12); color: #16a34a; border-radius: 999px; padding: 3px 8px;
}
.vn-team-cycle__dot {
    width: 15px; height: 15px; border-radius: 50%; border: 1.5px solid #c9c9cf; display: inline-block;
}
.vn-team-cycle.is-on .vn-team-cycle__dot { border-color: #16a34a; background: radial-gradient(circle, #16a34a 45%, transparent 50%); }
.vn-team-modal__box { border: 1px solid #E4E4E7; border-radius: 12px; padding: 12px 13px; margin-bottom: 14px; }
.vn-team-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 0; font-size: 13px; }
.vn-team-row b { font-weight: 650; }
.vn-team-row--total { border-top: 1px solid #ECECEF; margin-top: 6px; padding-top: 11px; font-size: 14px; }
.vn-team-row--total .vn-team-val { font-size: 16px; font-weight: 750; }
.vn-team-muted { color: #727272; font-size: 11.5px; }
.vn-team-val { font-weight: 700; font-variant-numeric: tabular-nums; }
.vn-team-step { display: inline-flex; align-items: center; gap: 8px; }
.vn-team-step button {
    width: 26px; height: 26px; border-radius: 8px; border: 1px solid #E4E4E7;
    background: transparent; color: inherit; cursor: pointer; font-size: 14px; line-height: 1;
}
.vn-team-step button:hover { border-color: #a2a2a2; }
.vn-team-step output { min-width: 34px; text-align: center; font-weight: 700; font-variant-numeric: tabular-nums; }
.vn-team-feats { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.vn-team-feats li { display: flex; gap: 9px; font-size: 12.5px; color: #3f3f46; line-height: 1.45; }
.vn-team-feats i { color: #16a34a; font-size: 12px; margin-top: 2px; flex: none; }
.vn-team-modal__ft { display: flex; justify-content: flex-end; gap: 9px; }
.vn-team-btn {
    border-radius: 9px; padding: 9px 15px; font: 650 13px/1 inherit; cursor: pointer;
    border: 1px solid #E4E4E7; background: transparent; color: inherit;
}
.vn-team-btn:hover { border-color: #a2a2a2; }
.vn-team-btn--primary { background: #16a34a; border-color: #16a34a; color: #fff; }
.vn-team-btn--primary:hover { background: #15803d; border-color: #15803d; }
.vn-team-name { width: 100%; border: 1px solid #E4E4E7; border-radius: 9px; padding: 9px 12px; font: inherit; font-size: 13px; margin-bottom: 10px; background: transparent; color: inherit; outline: none; }
.vn-team-name:focus { border-color: #16a34a; }
.vn-team-err { color: #dc2626; font-size: 12px; margin: 0 0 8px; }
body[data-background-color="dark"] .vn-team-modal__card { background: #141416; color: #f4f4f5; border-color: #303036; }
body[data-background-color="dark"] .vn-team-modal__x:hover { background: #1c1c1f; color: #fff; }
body[data-background-color="dark"] .vn-team-cycle { border-color: #303036; }
body[data-background-color="dark"] .vn-team-cycle.is-on { border-color: #16a34a; background: rgba(22,163,74,.10); }
body[data-background-color="dark"] .vn-team-cycle__per,
body[data-background-color="dark"] .vn-team-muted { color: #9d9da3; }
body[data-background-color="dark"] .vn-team-modal__box { border-color: #303036; }
body[data-background-color="dark"] .vn-team-row--total { border-top-color: #26262b; }
body[data-background-color="dark"] .vn-team-step button { border-color: #303036; }
body[data-background-color="dark"] .vn-team-feats li { color: #c9c9cf; }
body[data-background-color="dark"] .vn-team-btn { border-color: #303036; }
body[data-background-color="dark"] .vn-team-btn--primary { border-color: #16a34a; }
body[data-background-color="dark"] .vn-team-name { border-color: #303036; }

/* ── "Use Volnyn anywhere" popover (monitor icon in the user row) ── */
.vai-apps-pop {
    position: absolute;
    left: 0; right: 0;
    bottom: calc(100% + 8px);
    background: #ffffff;
    border: 1px solid #ebebeb;
    border-radius: 14px;
    box-shadow: 0 14px 34px rgba(15,23,42,0.14), 0 2px 8px rgba(15,23,42,0.08);
    display: none;
    z-index: 100060;
    overflow: hidden;
}
.vai-apps-pop.is-open { display: block; animation: wixMenuIn .16s ease; }
.vai-apps-pop__hero {
    height: 118px;
    background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 45%, #86efac 100%);
    display: flex; align-items: flex-end; justify-content: center;
    overflow: hidden;
}
/* Tiny CSS phone mockup peeking from the hero's bottom edge */
.vai-apps-pop__phone {
    position: relative; width: 128px; height: 96px;
    background: #ffffff; border-radius: 18px 18px 0 0;
    box-shadow: 0 -6px 22px rgba(15,23,42,0.16);
    display: flex; flex-direction: column; align-items: center;
    padding-top: 20px; gap: 9px;
}
.vai-apps-pop__phone-notch {
    position: absolute; top: 7px; left: 50%; transform: translateX(-50%);
    width: 34px; height: 5px; border-radius: 100px; background: #e5e5e8;
}
.vai-apps-pop__phone-title { font-size: 9.5px; font-weight: 600; color: #18181B; }
.vai-apps-pop__phone-input {
    width: 86px; height: 20px; border-radius: 7px;
    background: #f4f4f5; border: 1px solid #ececef;
}
.vai-apps-pop__body { padding: 14px 16px 16px; }
.vai-apps-pop__title { font-size: 14.5px; font-weight: 600; color: #18181B; margin: 0 0 5px; }
.vai-apps-pop__text { font-size: 12.5px; color: #6b6b70; line-height: 1.5; margin: 0 0 12px; }
.vai-apps-pop__btn {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    width: 100%; padding: 9px 12px; border-radius: 10px; border: 0;
    background: #3d9a6a; color: #fff; font-size: 13px; font-weight: 600;
    cursor: pointer;
}
.vai-apps-pop__btn:hover { background: #2f7a54; }
body[data-background-color="dark"] .vai-apps-pop,
html[data-background-color="dark"] .vai-apps-pop { background: #141414; border-color: rgba(255,255,255,0.10); }
body[data-background-color="dark"] .vai-apps-pop__hero,
html[data-background-color="dark"] .vai-apps-pop__hero { background: linear-gradient(135deg, #14532d 0%, #166534 55%, #15803d 100%); }
body[data-background-color="dark"] .vai-apps-pop__phone,
html[data-background-color="dark"] .vai-apps-pop__phone { background: #1f1f23; }
body[data-background-color="dark"] .vai-apps-pop__phone-notch,
html[data-background-color="dark"] .vai-apps-pop__phone-notch { background: #3a3a40; }
body[data-background-color="dark"] .vai-apps-pop__phone-title,
html[data-background-color="dark"] .vai-apps-pop__phone-title { color: #f4f4f5; }
body[data-background-color="dark"] .vai-apps-pop__phone-input,
html[data-background-color="dark"] .vai-apps-pop__phone-input { background: #2a2a2f; border-color: #3a3a40; }
body[data-background-color="dark"] .vai-apps-pop__title,
html[data-background-color="dark"] .vai-apps-pop__title { color: #f4f4f5; }
body[data-background-color="dark"] .vai-apps-pop__text,
html[data-background-color="dark"] .vai-apps-pop__text { color: #a1a1a8; }
body[data-background-color="dark"] .vai-apps-pop__btn,
html[data-background-color="dark"] .vai-apps-pop__btn { background: #3d9a6a; color: #fff; }
body[data-background-color="dark"] .vai-apps-pop__btn:hover,
html[data-background-color="dark"] .vai-apps-pop__btn:hover { background: #358a5e; }

/* ── Mobile-app QR modal (opened from the user menu) ─────────────── */
.wix-appqr { position: fixed; inset: 0; z-index: 100000; display: none; align-items: center; justify-content: center; }
.wix-appqr.is-open { display: flex; }
.wix-appqr__overlay { position: absolute; inset: 0; background: rgba(15,15,18,0.55); }
.wix-appqr.is-open .wix-appqr__overlay { animation: wixAppQrFade .2s ease; }
.wix-appqr__card {
    position: relative; width: 560px; max-width: calc(100vw - 32px);
    background: #fff; border-radius: 20px; padding: 28px;
    text-align: left; box-shadow: 0 24px 64px rgba(0,0,0,0.28);
}
.wix-appqr.is-open .wix-appqr__card { animation: wixAppQrIn .26s cubic-bezier(0.22, 1, 0.36, 1); }
@keyframes wixAppQrFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes wixAppQrIn {
    from { opacity: 0; transform: translateY(14px) scale(0.96); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
.wix-appqr__close {
    position: absolute; top: 12px; right: 12px; width: 30px; height: 30px;
    border: 0; background: transparent; color: #8a8a8e; border-radius: 8px;
    cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
    z-index: 1;
}
.wix-appqr__close:hover { background: #f2f2f3; color: #18181B; }
.wix-appqr__body { display: flex; align-items: center; gap: 28px; }
.wix-appqr__info { flex: 1; min-width: 0; }
.wix-appqr__appicon {
    width: 46px; height: 46px; border-radius: 12px; margin-bottom: 14px;
    background: rgba(22,163,74,.10); border: 1px solid rgba(22,163,74,.22);
    display: flex; align-items: center; justify-content: center;
}
.wix-appqr__appicon img { width: 30px; height: 30px; object-fit: contain; }
.wix-appqr__title { font-size: 18px; font-weight: 700; color: #18181B; margin: 0 0 6px; letter-spacing: -.01em; }
.wix-appqr__text { font-size: 13.5px; color: #6b6b70; line-height: 1.55; margin: 0 0 18px; }
/* Official-style App Store badge */
.wix-appqr__badge {
    display: inline-flex; align-items: center; gap: 9px;
    background: #16a34a; color: #fff !important; border-radius: 10px;
    padding: 8px 16px 8px 13px; text-decoration: none !important;
    border: 1px solid #16a34a; transition: background .15s ease, border-color .15s ease;
}
.wix-appqr__badge:hover { background: #15803d; border-color: #15803d; }
.wix-appqr__badge svg { width: 22px; height: 22px; flex: 0 0 auto; }
.wix-appqr__badge small { display: block; font-size: 9.5px; line-height: 1.2; opacity: .85; font-weight: 500; }
.wix-appqr__badge b { display: block; font-size: 15px; line-height: 1.15; font-weight: 600; letter-spacing: -.01em; }
/* QR column — tile stays white in both themes so it scans */
.wix-appqr__qrcol { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 9px; }
.wix-appqr__code {
    position: relative;
    display: inline-flex; align-items: center; justify-content: center;
    background: #fff; border: 1px solid #ececef; border-radius: 14px;
    padding: 10px;
}
.wix-appqr__code svg { display: block; border-radius: 6px; }
/* Centered brand mark over the QR — error correction H absorbs the occlusion */
.wix-appqr__logo {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 38px; height: 38px; border-radius: 10px; background: #fff;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 0 0 3px #fff;
}
.wix-appqr__logo img { width: 28px; height: 28px; object-fit: contain; }
.wix-appqr__code-fallback { font-size: 12.5px; color: #8a8a8e; padding: 40px 30px; }
.wix-appqr__scanhint { font-size: 11.5px; color: #8a8a8e; font-weight: 500; }
@media (max-width: 560px) {
    .wix-appqr__body { flex-direction: column; align-items: flex-start; gap: 20px; }
    .wix-appqr__qrcol { align-self: center; }
}
body[data-background-color="dark"] .wix-appqr__card,
html[data-background-color="dark"] .wix-appqr__card { background: #000000; border: 1px solid rgba(255,255,255,0.10); }
body[data-background-color="dark"] .wix-appqr__overlay,
html[data-background-color="dark"] .wix-appqr__overlay { background: rgba(0,0,0,0.62); }
body[data-background-color="dark"] .wix-appqr__code,
html[data-background-color="dark"] .wix-appqr__code { border-color: transparent; }
body[data-background-color="dark"] .wix-appqr__title,
html[data-background-color="dark"] .wix-appqr__title { color: #f4f4f5; }
body[data-background-color="dark"] .wix-appqr__text,
html[data-background-color="dark"] .wix-appqr__text { color: #a1a1a8; }
body[data-background-color="dark"] .wix-appqr__scanhint,
html[data-background-color="dark"] .wix-appqr__scanhint { color: #8f8f96; }
body[data-background-color="dark"] .wix-appqr__close:hover,
html[data-background-color="dark"] .wix-appqr__close:hover { background: rgba(255,255,255,0.08); color: #f4f4f5; }
body[data-background-color="dark"] .wix-appqr__badge,
html[data-background-color="dark"] .wix-appqr__badge { background: #16a34a; color: #fff !important; border-color: #16a34a; }
body[data-background-color="dark"] .wix-appqr__badge:hover,
html[data-background-color="dark"] .wix-appqr__badge:hover { background: #15803d; border-color: #15803d; }

/* Collapsed rail: show only the avatar, hide text + upgrade + menu. */
body.sidebar-collapsed .wix-userbox {
    justify-content: center;
    padding: 8px;
    margin: auto auto 12px;
    width: 48px;
}
body.sidebar-collapsed .wix-userbox__info,
body.sidebar-collapsed .wix-userbox__actions { display: none !important; }
body.sidebar-collapsed .wix-userbox__main { flex: 0 0 auto; }
/* Guest login box (the logged-out branch below) has no .wix-userbox__info
   wrapper around its "Log in / Sign up" text — the collapsed-rail rules above
   never hid it, so it overflowed past the 48px-wide rail. Icon-only here too.
   NB: do not write the guest directive's name here — Blade compiles it even
   inside a CSS comment, which leaves an unclosed if and 500s every page. */
body.sidebar-collapsed .wix-userbox__guest-label { display: none !important; }
/* Rail only: the avatar has no name/plan beside it, so shrink it to sit in
   better proportion with the nav icons (stays 34px in the expanded sidebar). */
body.sidebar-collapsed .wix-userbox__avatar {
    width: 28px !important;
    height: 28px !important;
    font-size: 12px;
}
body.sidebar-collapsed .wix-usermenu {
    position: fixed;
    left: 72px;
    bottom: 12px;
    top: auto;
    right: auto;
    width: 260px;
}

/* Dark theme variant. */
.wix-sidebar[data-background-color="dark2"] .wix-userbox {
    background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.10);
}
.wix-sidebar[data-background-color="dark2"] .wix-userbox__name { color: #ffffff; }
.wix-sidebar[data-background-color="dark2"] .wix-userbox__plan { color: #ffffff; }
.wix-sidebar[data-background-color="dark2"] .wix-userbox__act { color: #ffffff; }
.wix-sidebar[data-background-color="dark2"] .wix-userbox__act:hover {
    background: rgba(255,255,255,0.08); color: #ffffff;
}
.wix-sidebar[data-background-color="dark2"] .wix-usermenu {
    background: #000000; border-color: rgba(255,255,255,0.10);
}
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__item { color: #ffffff; }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__item:hover { background: rgba(255,255,255,0.06); }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__theme { color: #ffffff; }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__head-name { color: #ffffff; }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__head-sub { color: #ffffff; }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__plan { background: rgba(255,255,255,0.05); }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__plan-name { color: #ffffff; }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__upgrade { background: #16a34a; color: #ffffff !important; }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__upgrade:hover { background: #15803d; }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__credits { color: #ffffff; border-top-color: rgba(255,255,255,0.10); }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__credits-left svg { color: #ffffff; }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__credits-val { color: #ffffff; }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__plan { border-color: rgba(255,255,255,0.10); }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__sep { background: rgba(255,255,255,0.10); }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__item i { color: #ffffff; }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__item--danger,
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__item--danger i { color: #f47c7c; }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__item--danger:hover { background: rgba(239,68,68,0.12); color: #f8a3a3; }
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__toggle span {
    background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.14); color: #ffffff;
}
.wix-sidebar[data-background-color="dark2"] .wix-usermenu__toggle input:checked + span { background: #16a34a; border-color: #16a34a; color: #fff; }

/* ── Usage & Billing modal (Manus-style, animated) ──────────────── */
.wix-billing {
    position: fixed; inset: 0; z-index: 100001;
    opacity: 0; pointer-events: none;
    transition: opacity .25s ease;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.wix-billing.is-open { opacity: 1; pointer-events: auto; }
.wix-billing__overlay { position: absolute; inset: 0; background: rgba(15,23,42,0.45); backdrop-filter: blur(3px); }
/* Keyframe entrance — plays reliably every time .is-open is set (class-toggle
   transitions can get skipped when the class lands in the same paint). */
@keyframes wixBillingPop {
    0%   { opacity: 0; transform: translate(-50%, -38%) scale(.9); }
    60%  { opacity: 1; }
    100% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
@keyframes wixBillingOverlayIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.wix-billing__dialog {
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%) scale(1);
    width: min(900px, calc(100vw - 40px));
    height: min(620px, calc(100vh - 56px));
    display: flex;
    background: #fff; border-radius: 18px; overflow: hidden;
    box-shadow: 0 24px 64px rgba(15,23,42,0.28);
}
/* ── Dark mode: the whole Account/Usage&Billing modal follows the theme —
   dark surfaces + light text instead of a white sheet whose headings the
   template's dark skin washes out. Scoped strictly to dark mode. */
body[data-background-color="dark"] .wix-billing__dialog { background: #2c2c2e !important; }
body[data-background-color="dark"] .wix-billing__nav {
    background: #252526 !important;
    border-color: #3a3a3c !important;
}
body[data-background-color="dark"] .wix-billing__nav-item { color: #ffffff !important; }
body[data-background-color="dark"] .wix-billing__nav-item:hover { background: #3a3a3c !important; }
body[data-background-color="dark"] .wix-billing__nav-item.is-active {
    background: #3a3a3c !important;
    color: #ffffff !important;
}
body[data-background-color="dark"] .wix-billing__nav-item--danger { color: #f47c7c !important; }
body[data-background-color="dark"] .wix-billing__nav-name,
body[data-background-color="dark"] .wix-billing__title,
body[data-background-color="dark"] .wix-billing__grouphead,
body[data-background-color="dark"] .wix-billing__subhead,
body[data-background-color="dark"] .wix-billing__line-title,
body[data-background-color="dark"] .wix-billing__profile-name,
body[data-background-color="dark"] .wix-billing__namebox-value,
body[data-background-color="dark"] .wix-billing__row-val,
body[data-background-color="dark"] .wix-billing__hist-amt,
body[data-background-color="dark"] .wix-billing__soon-title { color: #ffffff !important; }
body[data-background-color="dark"] .wix-billing__subtitle,
body[data-background-color="dark"] .wix-billing__nav-sub,
body[data-background-color="dark"] .wix-billing__groupsub,
body[data-background-color="dark"] .wix-billing__line-sub,
body[data-background-color="dark"] .wix-billing__row-sub,
body[data-background-color="dark"] .wix-billing__profile-email,
body[data-background-color="dark"] .wix-billing__field-label,
body[data-background-color="dark"] .wix-billing__namebox-label,
body[data-background-color="dark"] .wix-billing__form-hint,
body[data-background-color="dark"] .wix-billing__hist-date,
body[data-background-color="dark"] .wix-billing__soon-desc,
body[data-background-color="dark"] .wix-billing__nav-label { color: #ffffff !important; }
body[data-background-color="dark"] .wix-billing__card,
body[data-background-color="dark"] .wix-billing__plan,
body[data-background-color="dark"] .wix-billing__soon,
body[data-background-color="dark"] .wix-billing__hist-item {
    background: #3a3a3c !important;
    border-color: #48484a !important;
}
body[data-background-color="dark"] .wix-billing__row,
body[data-background-color="dark"] .wix-billing__line,
body[data-background-color="dark"] .wix-billing__hr,
body[data-background-color="dark"] .wix-billing__nav-sep { border-color: #2f2f2f !important; }
body[data-background-color="dark"] .wix-billing__input,
body[data-background-color="dark"] .wix-billing__select,
body[data-background-color="dark"] .wix-billing__textarea {
    background: #3a3a3c !important;
    border-color: #48484a !important;
    color: #ffffff !important;
}
body[data-background-color="dark"] .wix-billing__btn {
    background: #3a3a3c !important;
    border-color: #48484a !important;
    color: #ffffff !important;
}
body[data-background-color="dark"] .wix-billing__btn--primary {
    background: #16a34a !important;
    border-color: #16a34a !important;
    color: #ffffff !important;
}
body[data-background-color="dark"] .wix-billing__btn--danger {
    background: #7f1d1d !important;
    border-color: #7f1d1d !important;
    color: #fecaca !important;
}
body[data-background-color="dark"] .wix-billing__close { color: #ffffff !important; }
body[data-background-color="dark"] .wix-billing__close:hover { background: rgba(255,255,255,0.09) !important; color: #ffffff !important; }
/* Theme toggle (moon/sun/system) inside the dark General panel — the
   default span is white-filled and the only dark override is scoped to
   the sidebar (.wix-sidebar), so in the modal the icons showed as white
   boxes. Give the modal its own dark override. */
body[data-background-color="dark"] .wix-billing .wix-usermenu__toggle span {
    background: rgba(255,255,255,0.06) !important; border-color: rgba(255,255,255,0.14) !important; color: #ffffff !important;
}
body[data-background-color="dark"] .wix-billing .wix-usermenu__toggle input:checked + span { background: #16a34a !important; border-color: #16a34a !important; color: #ffffff !important; }
/* Second pass — pieces the first dark sweep missed (found in dark QA):
   the plan name span, the Full name value box (light gray fill), the
   sign-out icon button, the plan-card divider, row labels, and the
   credits history (dark-on-dark titles, pastel icon chips, light-red
   amount pills that ended up white-on-pink). */
body[data-background-color="dark"] .wix-billing__plan { color: #ffffff !important; }
body[data-background-color="dark"] .wix-billing__card-head { border-bottom-color: #2f2f2f !important; }
body[data-background-color="dark"] .wix-billing__row-left { color: #ffffff !important; }
body[data-background-color="dark"] .wix-billing__row-left svg,
body[data-background-color="dark"] .wix-billing__row-left i { color: #ffffff !important; }
body[data-background-color="dark"] .wix-billing__namebox { background: transparent !important; border: 0 !important; }
body[data-background-color="dark"] .wix-billing__namebox-value {
    background: #3a3a3c !important;
    border-color: #48484a !important;
}
body[data-background-color="dark"] .wix-billing__icon-btn {
    background: #3a3a3c !important;
    border-color: #48484a !important;
    color: #ffffff !important;
}
body[data-background-color="dark"] .wix-billing__icon-btn:hover { background: #48484a !important; color: #ffffff !important; }
body[data-background-color="dark"] .wix-billing__hist-item:hover { background: #48484a !important; }
body[data-background-color="dark"] .wix-billing__hist-action { color: #ffffff !important; }
body[data-background-color="dark"] .wix-billing__hist-amt {
    color: #f47c7c !important;
    background: rgba(239,68,68,.14) !important;
}
body[data-background-color="dark"] .wix-billing__hist-icon { background: rgba(99,102,241,.16) !important; color: #a5b4fc !important; }
body[data-background-color="dark"] .wix-billing__hist-icon--build { background: rgba(99,102,241,.16) !important; color: #a5b4fc !important; }
body[data-background-color="dark"] .wix-billing__hist-icon--chat  { background: rgba(16,185,129,.14) !important; color: #6ee7b7 !important; }
body[data-background-color="dark"] .wix-billing__hist-icon--image { background: rgba(245,158,11,.14) !important; color: #fcd34d !important; }
body[data-background-color="dark"] .wix-billing__hist-icon--video { background: rgba(236,72,153,.14) !important; color: #f9a8d4 !important; }
.wix-billing.is-open .wix-billing__dialog { animation: wixBillingPop .6s cubic-bezier(.16,1,.3,1) both; }
.wix-billing.is-open .wix-billing__overlay { animation: wixBillingOverlayIn .45s ease both; }
.wix-billing__close {
    position: absolute; top: 16px; right: 16px; z-index: 2;
    width: 34px; height: 34px; border: 0; background: transparent;
    color: #a2a2a2; border-radius: 9px; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
}
.wix-billing__close:hover { background: #f4f4f5; color: #18181b; }

/* Left rail */
.wix-billing__nav {
    width: 226px; flex-shrink: 0;
    background: #fafafa; border-right: 1px solid #ececf0;
    padding: 16px 12px; overflow-y: auto;
    scrollbar-width: thin; scrollbar-color: #d4d4d8 transparent;
}
.wix-billing__nav-head { display: flex; align-items: center; gap: 9px; padding: 4px 6px 14px; }
.wix-billing__nav-avatar {
    width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; overflow: hidden;
    display: inline-flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #16a34a, #15803d); color: #fff; font-weight: 700; font-size: 13px;
}
.wix-billing__nav-avatar img { width: 100%; height: 100%; object-fit: cover; }
.wix-billing__nav-info { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.wix-billing__nav-name { font-size: 13px; font-weight: 700; color: #18181b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wix-billing__nav-sub { font-size: 11.5px; color: #727272; }
.wix-billing__nav-label { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: #a2a2a2; padding: 10px 6px 4px; }
.wix-billing__nav-item {
    display: flex; align-items: center; gap: 9px; width: 100%;
    padding: 7px 9px; border: 0; background: transparent;
    border-radius: 8px; font-size: 12.5px; font-weight: 500;
    color: #3f3f46; text-decoration: none; cursor: pointer; text-align: left;
}
.wix-billing__nav-item i { width: 15px; text-align: center; color: #727272; font-size: 12px; }
.wix-billing__nav-item:hover { background: #f0f0f1; color: #18181b; text-decoration: none; }
.wix-billing__nav-item.is-active { background: #f0faf4; color: #18181b; }
.wix-billing__nav-item.is-active i { color: #16a34a; }

/* Main panel */
.wix-billing__main { flex: 1 1 auto; padding: 24px 28px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #d4d4d8 transparent; }
.wix-billing__title { font-size: 22px; font-weight: 700; color: #161616; margin: 0 0 18px; }
.wix-billing__card { border: 1px solid #ececf0; border-radius: 14px; padding: 16px 18px; background: #fbfbfc; }
.wix-billing__card-head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 12px; border-bottom: 1px solid #ececf0; margin-bottom: 4px; }
.wix-billing__plan { font-size: 17px; font-weight: 800; color: #161616; }
.wix-billing__upgrade {
    background: #16a34a; color: #fff !important; text-decoration: none !important;
    font-size: 12.5px; font-weight: 600; padding: 7px 16px; border-radius: 999px;
    transition: background .15s ease;
}
.wix-billing__upgrade:hover { background: #15803d; }
.wix-billing__row { display: flex; align-items: center; justify-content: space-between; padding: 10px 0; }
.wix-billing__row + .wix-billing__row { border-top: 1px solid #f0f0f1; }
.wix-billing__row-left { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; color: #18181b; flex-wrap: wrap; }
.wix-billing__row-left svg, .wix-billing__row-left i { color: #535353; }
.wix-billing__row-left svg { width: 15px; height: 15px; }
.wix-billing__row-sub { flex-basis: 100%; padding-left: 23px; font-size: 11.5px; font-weight: 400; color: #a2a2a2; }
.wix-billing__row-val { font-size: 14.5px; font-weight: 700; color: #161616; }
.wix-billing__info { margin-left: -3px; font-size: 11.5px !important; color: #bbbbbb !important; cursor: help; }
.wix-billing__subtitle { font-size: 14px; font-weight: 700; color: #161616; margin: 22px 0 10px; }
.wix-billing__empty { color: #a2a2a2; font-size: 12.5px; padding: 8px 0; }
.wix-billing__history { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.wix-billing__hist-item {
    display: flex; align-items: center; gap: 12px;
    padding: 9px 10px; border-radius: 12px;
    transition: background .15s ease;
}
.wix-billing__hist-item:hover { background: #f8fafc; }
.wix-billing__hist-icon {
    width: 38px; height: 38px; flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 11px; font-size: 14px;
    background: #f2f2f2; color: #6366f1;
}
.wix-billing__hist-icon--build { background: #f2f2f2; color: #6366f1; }
.wix-billing__hist-icon--chat  { background: #f7f7f7; color: #10b981; }
.wix-billing__hist-icon--image { background: #fff7ed; color: #f59e0b; }
.wix-billing__hist-icon--video { background: #fdf2f8; color: #ec4899; }
.wix-billing__hist-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.wix-billing__hist-action { font-size: 14px; font-weight: 600; color: #161616; }
.wix-billing__hist-date { font-size: 12px; color: #a1a1a1; }
.wix-billing__hist-amt {
    font-size: 13px; font-weight: 700; color: #dc2626; flex-shrink: 0;
    font-variant-numeric: tabular-nums;
    background: #fef2f2; padding: 5px 10px; border-radius: 8px;
}

/* Usage progress meters (replaces the credits history list) */
.wix-billing__meter { padding: 12px 2px; }
.wix-billing__meter + .wix-billing__meter { border-top: 1px solid #f0f0f1; }
.wix-billing__meter-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 8px; }
.wix-billing__meter-label { font-size: 13px; font-weight: 600; color: #161616; }
.wix-billing__meter-val { font-size: 12.5px; font-weight: 700; color: #3f3f46; font-variant-numeric: tabular-nums; }
.wix-billing__meter-track { height: 8px; border-radius: 999px; background: #ececf0; overflow: hidden; }
.wix-billing__meter-fill {
    display: block; height: 100%; border-radius: 999px;
    background: #16a34a; transition: width .5s cubic-bezier(.16,1,.3,1);
}
.wix-billing__meter-fill.is-full { background: #dc2626; }
.wix-billing__meter-sub { display: block; margin-top: 7px; font-size: 11.5px; color: #a2a2a2; }
body[data-background-color="dark"] .wix-billing__meter + .wix-billing__meter { border-top-color: #2f2f2f !important; }
body[data-background-color="dark"] .wix-billing__meter-label { color: #ffffff !important; }
body[data-background-color="dark"] .wix-billing__meter-val { color: #e4e4e7 !important; }
body[data-background-color="dark"] .wix-billing__meter-track { background: #2a2a2a !important; }
body[data-background-color="dark"] .wix-billing__meter-fill { background: #22c55e !important; }
body[data-background-color="dark"] .wix-billing__meter-fill.is-full { background: #f47c7c !important; }

/* Billing panel — plan header, payment, invoices table */
.wix-billing__planhead { display: flex; align-items: center; gap: 14px; padding: 4px 2px 20px; }
.wix-billing__planhead-icon {
    width: 44px; height: 44px; flex-shrink: 0; border-radius: 12px;
    display: inline-flex; align-items: center; justify-content: center;
    background: #f0faf4; color: #16a34a;
}
.wix-billing__planhead-info { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.wix-billing__planhead-name { font-size: 16px; font-weight: 800; color: #161616; }
.wix-billing__planhead-sub { font-size: 12.5px; color: #727272; }
.wix-billing__btn--solid { background: #16a34a; border-color: #16a34a; color: #fff !important; }
.wix-billing__btn--solid:hover { background: #15803d; border-color: #15803d; color: #fff !important; }
.wix-billing__table-wrap { overflow-x: auto; }
.wix-billing__table { width: 100%; border-collapse: collapse; font-size: 13px; }
.wix-billing__table th {
    text-align: left; padding: 8px 12px 10px; font-size: 11.5px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .03em; color: #a2a2a2; border-bottom: 1px solid #ececf0;
}
.wix-billing__table td { padding: 12px; color: #18181b; border-bottom: 1px solid #f4f4f5; font-variant-numeric: tabular-nums; }
.wix-billing__table tr:last-child td { border-bottom: 0; }
.wix-billing__pill { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 600; }
.wix-billing__pill--ok { background: #f0faf4; color: #15803d; }
.wix-billing__link { color: #2563eb; font-weight: 600; text-decoration: none; }
.wix-billing__link:hover { text-decoration: underline; }
.wix-billing__muted { color: #c4c4c8; }
body[data-background-color="dark"] .wix-billing__planhead-icon { background: rgba(34,197,94,.14) !important; color: #4ade80 !important; }
body[data-background-color="dark"] .wix-billing__planhead-name { color: #ffffff !important; }
body[data-background-color="dark"] .wix-billing__planhead-sub { color: #a1a1a1 !important; }
body[data-background-color="dark"] .wix-billing__table th { color: #8b8b8b !important; border-bottom-color: #2f2f2f !important; }
body[data-background-color="dark"] .wix-billing__table td { color: #e4e4e7 !important; border-bottom-color: #262626 !important; }
body[data-background-color="dark"] .wix-billing__pill--ok { background: rgba(34,197,94,.14) !important; color: #6ee7b7 !important; }
body[data-background-color="dark"] .wix-billing__link { color: #60a5fa !important; }
body[data-background-color="dark"] .wix-billing__muted { color: #52525b !important; }

/* Thin, subtle scrollbars (WebKit) — match Manus's refined look */
.wix-billing__nav::-webkit-scrollbar, .wix-billing__main::-webkit-scrollbar { width: 8px; }
.wix-billing__nav::-webkit-scrollbar-track, .wix-billing__main::-webkit-scrollbar-track { background: transparent; }
.wix-billing__nav::-webkit-scrollbar-thumb, .wix-billing__main::-webkit-scrollbar-thumb {
    background: #d4d4d8; border-radius: 8px; border: 2px solid transparent; background-clip: content-box;
}
.wix-billing__nav::-webkit-scrollbar-thumb:hover, .wix-billing__main::-webkit-scrollbar-thumb:hover {
    background: #a2a2a2; background-clip: content-box;
}
/* Mobile back button (section list ← panel). Hidden on desktop. */
.wix-billing__mback {
    display: none; align-items: center; gap: 9px; margin: -4px 0 14px; padding: 8px 2px;
    background: none; border: 0; font-size: 14.5px; font-weight: 700; color: #18181b; cursor: pointer;
}
.wix-billing__mback i { color: #727272; font-size: 13px; }
@media (max-width: 720px) {
    .wix-billing__dialog { flex-direction: column; height: calc(100vh - 40px); }
    .wix-billing__nav { width: 100%; display: flex; flex-direction: column; gap: 2px; padding: 16px; overflow-y: auto; }
    .wix-billing__nav-head { flex-basis: 100%; }
    .wix-billing__nav-label { display: block; }
    .wix-billing__nav-item { width: 100%; }
    /* Two-view: the section list shows first; tapping a section swaps to its
       full-height panel with a back button, so nothing gets squished off-screen. */
    .wix-billing__main { display: none; }
    .wix-billing__dialog.is-mpanel .wix-billing__nav { display: none; }
    .wix-billing__dialog.is-mpanel .wix-billing__main { display: block; }
    .wix-billing__mback { display: inline-flex; }
}

/* Account button in the user menu — match the link rows */
button.wix-usermenu__item {
    width: 100%; border: 0; background: transparent;
    cursor: pointer; font: inherit; text-align: left;
}

/* Left-rail extras */
.wix-billing__nav-ext { margin-left: auto; font-size: 10px !important; color: #bbbbbb !important; }
.wix-billing__nav-item--danger { color: #dc2626; }
.wix-billing__nav-item--danger i { color: #dc2626; }
.wix-billing__nav-item--danger:hover { background: #fee2e2; color: #b91c1c; }

/* Panels — only the active one shows */
.wix-billing__panel { display: none; }
.wix-billing__panel.is-active { display: block; animation: wixMenuIn .18s ease; }

/* Account panel */
.wix-billing__profile {
    display: flex; align-items: center; gap: 14px;
    padding: 16px 18px; border: 1px solid #ececf0; border-radius: 14px; background: #fbfbfc;
}
.wix-billing__profile-avatar {
    width: 52px; height: 52px; border-radius: 50%; flex-shrink: 0; overflow: hidden;
    display: inline-flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #16a34a, #15803d); color: #fff; font-weight: 700; font-size: 20px;
}
.wix-billing__profile-avatar img { width: 100%; height: 100%; object-fit: cover; }
.wix-billing__profile-info { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.wix-billing__profile-name { font-size: 16px; font-weight: 700; color: #161616; }
.wix-billing__profile-email { font-size: 13px; color: #727272; }
.wix-billing__fields { margin: 18px 0 0; padding: 0; }
.wix-billing__field { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 2px; border-bottom: 1px solid #f0f0f1; }
.wix-billing__field dt { margin: 0; font-size: 13.5px; font-weight: 500; color: #727272; }
.wix-billing__field dd { margin: 0; font-size: 13.5px; font-weight: 600; color: #18181b; text-align: right; word-break: break-word; }
.wix-billing__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.wix-billing__btn {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 8px 15px; border-radius: 999px;
    border: 1px solid #e5e7eb; background: #fff;
    font-size: 12.5px; font-weight: 600; color: #18181b; text-decoration: none !important;
    cursor: pointer; transition: background .15s ease, border-color .15s ease;
}
.wix-billing__btn i { font-size: 12px; color: #535353; }
.wix-billing__btn:hover { background: #f4f4f5; border-color: #d4d4d8; color: #18181b; }
.wix-billing__profile .wix-billing__btn { margin-left: auto; flex-shrink: 0; }
.wix-billing__btn--danger { color: #dc2626; border-color: #f3c2c2; }
.wix-billing__btn--danger:hover { background: #fef2f2; border-color: #ef4444; color: #b91c1c; }
.wix-billing__btn--danger:disabled { opacity: .5; cursor: not-allowed; }

/* Account panel — Manus-style rows */
.wix-billing__acct-top { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.wix-billing__acct-avatar {
    width: 48px; height: 48px; border-radius: 50%; flex-shrink: 0; overflow: hidden;
    display: inline-flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #16a34a, #15803d); color: #fff; font-weight: 700; font-size: 19px;
}
.wix-billing__acct-avatar img { width: 100%; height: 100%; object-fit: cover; }
.wix-billing__namebox { flex: 1 1 auto; display: flex; flex-direction: column; gap: 5px; min-width: 0; margin: 0; }
.wix-billing__namebox-label { font-size: 12.5px; color: #727272; }
.wix-billing__namebox-value {
    background: #f1f1f3; border: 1px solid #ececf0; border-radius: 10px;
    padding: 10px 13px; font-size: 13.5px; font-weight: 500; color: #18181b;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.wix-billing__icon-btn {
    width: 40px; height: 40px; flex-shrink: 0; align-self: flex-end;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid #e5e7eb; border-radius: 10px; background: #fff;
    color: #535353; text-decoration: none; transition: background .15s ease, color .15s ease;
}
.wix-billing__icon-btn:hover { background: #f4f4f5; color: #18181b; }
.wix-billing__icon-btn svg { width: 16px; height: 16px; }
.wix-billing__line { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; }
.wix-billing__line-info { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.wix-billing__line-title { font-size: 14px; font-weight: 700; color: #18181b; }
.wix-billing__line-sub { font-size: 12.5px; color: #727272; word-break: break-word; }
.wix-billing__hr { height: 1px; background: #ececf0; margin: 6px 0; }

/* ── AI Meeting Notes panel ── */
.wix-billing__grouphead { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; color: #161616; margin: 14px 0 4px; }
.wix-billing__panel[data-panel-content="meeting"] .wix-billing__grouphead:first-of-type { margin-top: 0; }

/* ── Mail Volnyn, inside the settings modal ── */
.vmail { margin-top: 26px; }
.vmail__head { margin-bottom: 16px; }
.vmail__h { font-weight: 700; font-size: 17px; }
.vmail__sub { font-size: 12.5px; opacity: .6; margin-top: 3px; }
.vmail__notready {
  border: 1px solid rgba(245,158,11,.4); background: rgba(245,158,11,.08);
  border-radius: 12px; padding: 12px 14px; font-size: 12.5px; line-height: 1.55;
  margin-bottom: 16px;
}
.vmail__tabs { display: flex; gap: 20px; border-bottom: 1px solid rgba(128,128,128,.25); margin-bottom: 6px; }
.vmail__tab {
  background: none; border: 0; padding: 0 0 10px; cursor: pointer;
  font-weight: 600; font-size: 13.5px; opacity: .55; color: inherit;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.vmail__tab.is-on { opacity: 1; border-bottom-color: currentColor; }
.vmail__row {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 14px; padding: 16px 0; border-bottom: 1px solid rgba(128,128,128,.16);
}
.vmail__rowtext { min-width: 0; }
.vmail__rt { font-weight: 600; font-size: 14px; }
.vmail__rs { font-size: 12.5px; opacity: .6; margin-top: 2px; }
.vmail__rowval { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 13.5px; white-space: nowrap; }
.vmail__btn {
  flex-shrink: 0; padding: 8px 14px; border-radius: 10px; cursor: pointer;
  font-weight: 600; font-size: 12.5px; color: inherit;
  border: 1px solid rgba(128,128,128,.35); background: transparent;
}
.vmail__btn:hover { background: rgba(128,128,128,.14); }
.vmail__ic { background: none; border: 0; cursor: pointer; color: inherit; opacity: .55; padding: 3px; }
.vmail__ic:hover { opacity: 1; }
.vmail__list { display: flex; flex-direction: column; gap: 8px; margin: 12px 0 4px; }
.vmail__item {
  display: flex; align-items: center; gap: 10px; padding: 12px 14px;
  border: 1px solid rgba(128,128,128,.28); border-radius: 12px;
}
.vmail__item i { opacity: .5; flex-shrink: 0; }
.vmail__itembody { flex: 1; min-width: 0; }
.vmail__addr { font-size: 13.5px; word-break: break-all; }
.vmail__meta { font-size: 12px; opacity: .55; margin-top: 2px; }
.vmail__empty { font-size: 12.5px; opacity: .45; padding: 12px 2px; }
.vmail__msgtop { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.vmail__pill { font-size: 10.5px; font-weight: 700; padding: 3px 8px; border-radius: 999px; white-space: nowrap; }
.vmail__pill.ok { background: rgba(43,227,138,.16); color: #2BE38A; }
.vmail__pill.warn { background: rgba(245,158,11,.16); color: #f59e0b; }
.vmail__pill.bad { background: rgba(239,68,68,.16); color: #f87171; }
.wix-billing__groupsub { font-size: 12.5px; color: #727272; margin: 0 0 6px; }
.wix-mn-cal { flex-direction: row !important; align-items: center; gap: 12px; }
.wix-mn-cal__ic { width: 34px; height: 34px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; border: 1px solid #ececf0; overflow: hidden; }
.wix-mn-ok { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: #16a34a; }
.wix-mn-soon { font-size: 10.5px; font-weight: 700; color: #92610a; background: #fef3c7; padding: 2px 8px; border-radius: 999px; letter-spacing: .02em; }
.wix-mn-select { border: 1px solid #e4e4e7; border-radius: 9px; padding: 8px 12px; font-size: 13px; color: #18181b; background: #fff; cursor: pointer; min-width: 150px; }
.wix-mn-select:focus { outline: none; border-color: #16a34a; box-shadow: 0 0 0 3px rgba(22,163,74,.12); }
.wix-mn-toggle { position: relative; display: inline-block; width: 40px; height: 22px; flex-shrink: 0; }
.wix-mn-toggle input { opacity: 0; width: 0; height: 0; }
.wix-mn-toggle span { position: absolute; inset: 0; background: #d4d4d8; border-radius: 999px; transition: background .18s; cursor: pointer; }
.wix-mn-toggle span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .18s; }
.wix-mn-toggle input:checked + span { background: #16a34a; }
.wix-mn-toggle input:checked + span::after { transform: translateX(18px); }
.wix-mn-toggle input:disabled + span { opacity: .5; cursor: not-allowed; }

/* Left-rail divider */
.wix-billing__nav-sep { height: 1px; background: #ececf0; margin: 10px 8px; }

/* Language select inside General */
.wix-billing__select {
    border: 1px solid #e5e7eb; border-radius: 8px; background: #fff;
    padding: 7px 10px; font-size: 13px; font-weight: 500; color: #18181b; cursor: pointer;
}

/* ── My Computer panel ─────────────────────────────────────────────────
   Neutral colours only (currentColor + rgba) so it inherits whichever theme
   the settings dialog is in, like the Mail panel above it. */
.vcomp__loading, .vcomp__notready {
    border: 1px solid rgba(128,128,128,.28);
    border-radius: 12px;
    padding: 14px 16px;
    font-size: 13px;
    line-height: 1.55;
    opacity: .75;
}
.vcomp__notready { border-color: rgba(234,179,8,.45); background: rgba(234,179,8,.08); opacity: 1; }
.vcomp__card { border: 1px solid rgba(128,128,128,.28); border-radius: 14px; padding: 16px 18px; }
.vcomp__row { display: flex; align-items: center; gap: 14px; }
.vcomp__icon {
    flex: 0 0 auto; width: 42px; height: 42px; border-radius: 11px;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(22,163,74,.14); color: #16a34a; font-size: 17px;
}
.vcomp__meta { flex: 1 1 auto; min-width: 0; }
.vcomp__name { font-weight: 600; font-size: 14.5px; display: flex; align-items: center; gap: 8px; }
.vcomp__sub  { font-size: 12.5px; opacity: .65; margin-top: 2px; line-height: 1.5; }
.vcomp__pill {
    font-size: 11px; font-weight: 600; letter-spacing: .02em;
    padding: 2px 8px; border-radius: 999px;
    background: rgba(128,128,128,.22); color: inherit; opacity: .85;
}
.vcomp__pill.is-on      { background: rgba(22,163,74,.18);  color: #16a34a; opacity: 1; }
.vcomp__pill.is-pending { background: rgba(234,179,8,.18);  color: #b45309; opacity: 1; }
.vcomp__pill.is-fail    { background: rgba(220,38,38,.16);  color: #dc2626; opacity: 1; }
.vcomp__actions { flex: 0 0 auto; display: flex; gap: 8px; }
.vcomp__btn {
    appearance: none; border: 1px solid rgba(128,128,128,.38);
    background: transparent; color: inherit;
    padding: 8px 16px; border-radius: 9px;
    font-size: 13px; font-weight: 600; cursor: pointer; font-family: inherit;
    text-decoration: none; display: inline-flex; align-items: center;
    transition: background .15s ease, border-color .15s ease, opacity .15s ease;
}
.vcomp__btn:hover { background: rgba(128,128,128,.14); }
.vcomp__btn--primary { background: #16a34a; border-color: #16a34a; color: #fff; }
.vcomp__btn--primary:hover { background: #15803d; border-color: #15803d; }
.vcomp__btn[disabled] { opacity: .55; cursor: default; pointer-events: none; }
.vcomp__stats {
    display: flex; flex-wrap: wrap; gap: 10px 26px;
    margin-top: 14px; padding-top: 13px; border-top: 1px solid rgba(128,128,128,.22);
}
.vcomp__stat { font-size: 12.5px; display: flex; flex-direction: column; gap: 2px; }
.vcomp__stat span { opacity: .6; }
.vcomp__stat b { font-weight: 600; }
.vcomp__err {
    margin-top: 12px; padding: 10px 12px; border-radius: 9px;
    background: rgba(220,38,38,.10); color: #dc2626; font-size: 12.5px; line-height: 1.5;
}
.vcomp__link { display: inline-flex; align-items: center; gap: 7px; margin-top: 14px; font-size: 13px; font-weight: 600; color: #16a34a; text-decoration: none; }
.vcomp__link:hover { text-decoration: underline; }
.vcomp__upsell {
    margin-top: 16px; border: 1px solid rgba(128,128,128,.28); border-radius: 14px;
    padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; gap: 14px;
}
.vcomp__danger {
    appearance: none; border: 0; background: transparent;
    color: #dc2626; font-size: 12.5px; font-weight: 600;
    margin-top: 16px; padding: 4px 0; cursor: pointer; font-family: inherit;
}
.vcomp__danger:hover { text-decoration: underline; }
@media (max-width: 620px) {
    .vcomp__row { flex-wrap: wrap; }
    .vcomp__actions { width: 100%; }
    .vcomp__actions .vcomp__btn { flex: 1 1 auto; justify-content: center; }
    .vcomp__upsell { flex-direction: column; align-items: stretch; }
}

/* "Coming soon" placeholder panels */
.wix-billing__soon {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    padding: 48px 24px; border: 1px dashed #e0e0e6; border-radius: 16px; background: #fbfbfc;
}
.wix-billing__soon-icon {
    width: 56px; height: 56px; border-radius: 16px;
    display: inline-flex; align-items: center; justify-content: center;
    background: #f2f2f2; color: #16a34a; font-size: 22px; margin-bottom: 16px;
}
.wix-billing__soon-title { font-size: 17px; font-weight: 700; color: #161616; }
.wix-billing__soon-desc { max-width: 360px; margin: 8px 0 16px; font-size: 13.5px; line-height: 1.55; color: #727272; }
.wix-billing__soon-badge {
    font-size: 11.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase;
    color: #16a34a; background: rgba(22,163,74,0.12); padding: 5px 12px; border-radius: 999px;
}

/* Personalization form */
.wix-billing__subhead { margin: -12px 0 22px; font-size: 13.5px; color: #727272; }
.wix-billing__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 560px) { .wix-billing__form-grid { grid-template-columns: 1fr; } }
.wix-billing__field-group { display: flex; flex-direction: column; gap: 7px; margin: 0 0 18px; }
.wix-billing__field-label { font-size: 13.5px; font-weight: 600; color: #18181b; }
.wix-billing__input, .wix-billing__textarea {
    width: 100%; box-sizing: border-box;
    background: #f4f4f5; border: 1px solid #ececf0; border-radius: 10px;
    padding: 11px 14px; font: 400 14px/1.5 'Inter', sans-serif; color: #18181b;
    transition: border-color .15s ease, background .15s ease;
}
.wix-billing__input::placeholder, .wix-billing__textarea::placeholder { color: #a2a2a2; }
.wix-billing__input:focus, .wix-billing__textarea:focus {
    outline: none; background: #fff; border-color: #16a34a;
}
.wix-billing__textarea { resize: vertical; min-height: 110px; }
.wix-billing__form-hint { margin: 4px 0 0; font-size: 12.5px; color: #a2a2a2; }
.wix-billing__form-actions { margin-top: 20px; }
.wix-billing__btn--primary {
    background: #16a34a; color: #fff; border-color: #16a34a;
    box-shadow: 0 6px 16px rgba(22,163,74,0.22);
}
.wix-billing__btn--primary:hover { background: #15803d; border-color: #15803d; color: #fff; }