/* showcase.css — AaaS view-only canvas: hide only AUTH + edit surfaces, keep VIEW controls.
 *
 * Reframed (2026-07-05): this is the AaaS read-only design canvas, not a public de-brand.
 * View-selectors are part of the canvas and MUST stay visible: the USER⇄OPS pill (.tb-mode)
 * and the Owner/Admin role switch (.role-switch) — they change WHICH view you see, they don't
 * edit data. We only hide what implies auth/login or operator config the view-only canvas
 * shouldn't expose. The vendored shell stays unedited (protocol §10.2); showcase-mode.js sets
 * data-showcase="1" and this overlay does the hiding.
 */

html[data-showcase]
.tb-login /* sign-in button (no auth in the view-only canvas) */,
html[data-showcase] .tb-avatar /* logged-in avatar / logout */,
html[data-showcase] .mm-aux-cta /* app-switcher (mega-menu) LOGIN CTA */,
html[data-showcase] .twk-panel {
	/* the L3 Tweaks / dev console */
	display: none !important;
}

/* KEPT VISIBLE on purpose: .tb-mode (USER⇄OPS), .role-switch (Owner/Admin/…),
   the tenant switcher, and the DATA (ALL/LIVE) toggle — these are the canvas's own
   view controls, not auth or edits. */

/* ============================================================================
/* ============================================================================
   RESPONSIVE FIXES (2026-07-07). The vendored shell's sub-page tab bar (e.g. the
   OPS stream's ~40 tabs) was a single fixed row that overflowed the viewport on
   narrower screens — tabs like "MCP servers" / "Approvals" were clipped off the
   right edge and unreachable. Let the tab bar (and action rows) WRAP so every tab
   fits + is reachable at any width. Vendored shell stays unedited (protocol §10.2);
   overlay only. (Kept deliberately narrow — broader table/pane overrides were
   dropped after they reflowed a flex legend dot into a stretched blob.)
   ============================================================================ */
.subnav {
	max-width: 100%;
}
.subnav-tabs {
	flex-wrap: wrap;
	row-gap: 3px;
	max-width: 100%;
}
.hero-actions,
.pane-actions {
	flex-wrap: wrap;
	gap: 8px;
}

/* The data-view icon toolbar (.tv-tools — e.g. the ~40-icon row above the Schedules
   table) is a fixed single flex row with no wrap/scroll, so it clipped off the right
   edge at narrower widths / higher zoom. Let it wrap (same approach as .subnav-tabs);
   overlay-only override of the vendored shell's inline style (protocol §10.2). */
.tv-tools {
	flex-wrap: wrap;
}