/* Eager Sites shell: reserve the destination before deferred assets/auth load.
   Keep Home mounted so leaving Sites restores the same conversation and draft. */
body.sites-page-open :is(#chatbox, .avatarSection, #networkCont, #compareCont,
  #actionsHubPage, #libraryPage, #usagePage, #flashcardsPage, #providerKeysPage,
  #account_settingsCont, #profilePage, #zbPagesHost, #menubar,
  #inputMessageCont, #modelOptions, #models, #activityButtonsCont,
  #switcherDesktop, #switcherMobile) {
  display: none !important;
}
#zbSitesHost {
  position: fixed;
  inset: 0 0 0 var(--zb-agent-browser-left, 52px);
  overflow: auto;
  z-index: 30;
  background: var(--bg-100, #fff);
  color: var(--text-100, #292927);
}
#zbSitesHost[hidden] { display: none !important; }
/* Home owns the shared mobile navigation toggle. Expose only that control,
   without restoring Home header chrome or its layout footprint over Sites. */
@media (max-width:991px) {
  body.sites-page-open #menubar {
    display:block!important; visibility:hidden!important;
    height:0!important; min-height:0!important; padding:0!important;
    margin:0!important; border:0!important; background:transparent!important;
    z-index:60!important;
  }
  body.sites-page-open #menubar .sidebarMenu2_0a:has(#open_settings2) { display:flex!important; }
  body.sites-page-open #open_settings2 {
    display:flex!important; visibility:visible!important; position:fixed!important;
    top:calc(env(safe-area-inset-top,0px) + 9px); left:calc(env(safe-area-inset-left,0px) + 18px); width:40px; height:40px; align-items:center;
  }
  #zbSitesHost { top:var(--sites-mobile-top,calc(env(safe-area-inset-top,0px) + 58px)); }
}

/* Persistent header action shares the dock control's size, palette and position.
   It appears only for the authorized, currently displayed Sites module. */
#theSidebar > #zbSitesSidebarCreate { display: none; }
html.zb-staging-nav[data-zb-sidebar-content="sites"] #theSidebar:has(#zbSites-sidebar:not([hidden]):not([data-zb-sidebar-parked])) > #zbSitesSidebarCreate { display: inline-flex; }
/* Size, gap, glyph, disabled state and pin-slot hiding use shared header chrome. */
.sites-sidebar .sites-sidebar-close { display:none; }
@media(max-width:991px){.sites-sidebar .sites-sidebar-close{display:inline-flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;padding:4px;border:0;border-radius:8px;background:transparent;color:var(--text-200);cursor:pointer}.sites-sidebar .sites-sidebar-close:is(:hover,:focus-visible){background:var(--zb-sidebar-hover,#8882)}}
.sites-sidebar .zb-sidebar-row { width: 100%; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sites-sidebar .zb-sidebar-row[aria-current] { background: var(--bg-300, #eee); }
.sites-sidebar .sites-sidebar-status { padding: 8px 12px; color: var(--text-300, #666); }
.sites-sidebar .zb-sidebar-row:focus-visible { outline: 2px solid var(--text-200, #555); outline-offset: -2px; }
.sites-sidebar .sites-sidebar-item { position:relative; }
#zbSites-sidebar .sites-sidebar-order-live { position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap; }
#zbSites-sidebar .sites-sidebar-item.sites-drag-source { opacity:.5; }
#zbSites-sidebar .sites-sidebar-item[data-site-drop]::after { content:'';position:absolute;inset-inline:8px;height:2px;border-radius:1px;background:var(--text-100);pointer-events:none;z-index:2; }
#zbSites-sidebar .sites-sidebar-item[data-site-drop=before]::after { top:0; }
#zbSites-sidebar .sites-sidebar-item[data-site-drop=after]::after { bottom:0; }
body.sites-sidebar-dragging,body.sites-sidebar-dragging * { cursor:grabbing!important;user-select:none!important; }

html.zb-staging-nav #agentList #zbSites-sidebar .sites-sidebar-item > .zb-sidebar-row { display:flex; gap:6px; padding-inline-end:44px; }
#zbSites-sidebar .sites-sidebar-label { flex:0 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#zbSites-sidebar .sites-sidebar-role { flex:0 0 14px; width:14px; height:14px; color:var(--text-300); }
html.zb-staging-nav #agentList #zbSites-sidebar .sites-sidebar-item:is(:hover,:focus-within,.sites-sidebar-menu-open) > .zb-sidebar-row { background:var(--zb-sidebar-hover)!important; }
.sites-sidebar .sites-sidebar-more:not(.zb-sidebar-row-options) { position:absolute; inset-inline-end:5px; top:50%; transform:translateY(-50%); display:flex; align-items:center; justify-content:center; width:28px; height:28px; padding:4px; margin:0; border:0; border-radius:8px; background:transparent; color:var(--text-200); cursor:pointer; opacity:0; pointer-events:none; }
.sites-sidebar .sites-sidebar-more:not(.zb-sidebar-row-options) svg { display:block; width:20px; height:20px; flex:none; }
.sites-sidebar .sites-sidebar-item:is(:hover,:focus-within,.sites-sidebar-menu-open) .sites-sidebar-more { opacity:1; pointer-events:auto; }
.sites-sidebar .sites-sidebar-more:not(.zb-sidebar-row-options):hover { background:var(--zb-sidebar-hover); color:var(--text-100); }
@media(hover:none),(max-width:991px){.sites-sidebar .sites-sidebar-more:not(.zb-sidebar-row-options){opacity:1;pointer-events:auto;}}
#zbSitesSidebarMenu { position:fixed; inset:auto; margin:0; width:210px; max-width:calc(100vw - 16px); max-height:calc(100dvh - 16px); overflow:auto; box-sizing:border-box; padding:var(--zb-popup-padding,6px); border:1px solid var(--zb-popup-border,var(--border-300)); border-radius:var(--zb-popup-radius,14px); background:var(--zb-popup-surface,var(--bg-200)); color:var(--zb-popup-text,var(--text-100)); box-shadow:var(--zb-popup-shadow,0 8px 24px #0003); }
#zbSitesSidebarMenu [role=menuitem] { display:block; width:100%; min-height:36px; padding:var(--zb-popup-item-padding,8px 10px); margin:0; border:0; border-radius:var(--zb-popup-item-radius,8px); background:transparent; color:inherit; font:inherit; font-size:14px; text-align:left; cursor:pointer; }
#zbSitesSidebarMenu [role=menuitem]:not(:disabled):is(:hover,:focus-visible) { background:var(--zb-popup-hover,var(--bg-300)); }
#zbSitesSidebarMenu [role=menuitem]:disabled { opacity:.45; cursor:default; }
#zbSitesSidebarMenu .sites-sidebar-menu-danger { color:var(--danger,#b42318); }

#zbSitesHost > .sites-loading { padding: 36px 48px; }
#zbSitesHost > .sites-loading h1 { margin: 0; font-size: 26px; }
/* First-paint placeholders stay static: no flashing, motion or deferred CSS. */
#zbSitesHost .sites-loading { box-sizing: border-box; }
#zbSitesHost .sites-boot-header { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:28px; }
#zbSitesHost .sites-boot-controls { display:flex; gap:12px; }
#zbSitesHost :is(.sites-boot-controls,.sites-boot-toolbar,.sites-boot-caption) > span,
#zbSitesHost .sites-boot-preview > span { display:block; border-radius:6px; background:var(--bg-300,#edede8); }
#zbSitesHost .sites-boot-controls > span { width:160px; height:36px; }
#zbSitesHost .sites-boot-controls > span:last-child { width:112px; }
#zbSitesHost .sites-boot-toolbar { display:flex; justify-content:space-between; margin-bottom:20px; }
#zbSitesHost .sites-boot-toolbar > span { width:72px; height:14px; }
#zbSitesHost .sites-boot-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
#zbSitesHost .sites-boot-card { min-width:0; overflow:hidden; border-radius:12px; background:var(--bg-200,#f7f7f5); }
#zbSitesHost .sites-boot-preview { height:190px; box-sizing:border-box; padding:32px 24px; display:flex; flex-direction:column; gap:12px; }
#zbSitesHost .sites-boot-preview > span { height:10px; width:65%; }
#zbSitesHost .sites-boot-preview > span:first-child { width:40%; height:22px; margin-bottom:8px; }
#zbSitesHost .sites-boot-preview > span:last-child { width:52%; }
#zbSitesHost .sites-boot-caption { padding:20px; display:flex; flex-direction:column; gap:12px; background:var(--bg-100,#fff); }
#zbSitesHost .sites-boot-caption > span { width:75%; height:12px; }
#zbSitesHost .sites-boot-caption > span:first-child { width:50%; height:16px; }
#zbSitesHost .sites-boot-caption > span:last-child { width:32%; height:10px; }

@media (max-width:1000px) { #zbSitesHost .sites-boot-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) {
 #zbSitesHost .sites-boot-header { align-items:flex-start; gap:16px; }
 #zbSitesHost .sites-boot-controls > span { width:100px; }
 #zbSitesHost .sites-boot-controls > span:last-child { display:none; }
 #zbSitesHost .sites-boot-grid { grid-template-columns:minmax(0,1fr); }
}
@media (max-width: 769px) {
  #zbSitesHost { left: 0; }
  #zbSitesHost > .sites-loading { padding: 24px 20px; }
}
/* Only the open phone editor absorbs the shared toggle into its own header. */
@media (max-width:760px) {
  #zbSitesHost:has(#zbSites-editor:not([hidden])) {
    top:0; bottom:auto; height:var(--sites-phone-height,100dvh); overflow:hidden;
  }
  body.sites-page-open:has(#zbSitesHost #zbSites-editor:not([hidden])) #open_settings2 {
    top:calc(env(safe-area-inset-top,0px) + 4px); left:8px;
  }
}
