/* zaaz-overrides.css — hides LibreChat UI that creators must not see (board 78).
   Served by the edge at /zaaz-overrides.css and injected into LibreChat's HTML pages by Caddy
   (`replace`, chatdemo.zaaz.co first; chat.zaaz.co after the beta check). Selectors use the stable
   element ids LibreChat renders (v0.8.8-rc1) — re-check them on every LibreChat upgrade.
   CSS hides, it does not disable: anything dangerous must ALSO be off server-side
   (account deletion: ALLOW_ACCOUNT_DELETION=false, 2026-10-19). */

/* Settings → Data & Privacy → API KEYS · "Revoke all provider API keys": no one stores provider keys
   (the model runs on the server's Bedrock role), so the control is noise. The whole section goes. */
section:has(#revoke-info-label) { display: none !important; }

/* Settings → Data & Privacy → Danger zone · "Delete TTS cache storage" (speech is not used). The row
   is the direct child of the section's bordered list; the second rule covers the settings search. */
section > div > *:has(#delete-cache-label),
:is(div, li):has(> div > #delete-cache-label) { display: none !important; }

/* Same for the revoke row in the settings search results (the section rule above covers the tab). */
:is(div, li):has(> div > #revoke-info-label) { display: none !important; }

/* Settings → Data & Privacy · "Import conversations from a JSON file": lets a user plant a
   fabricated conversation (fake assistant turns) in their own history — a jailbreak vector.
   ALSO blocked server-side at the edge (POST /api/convos/import → 403). */
section > div > *:has(#import-conversation-label),
:is(div, li):has(> div > #import-conversation-label) { display: none !important; }

/* Settings → Data & Privacy · "Shared chats": sharing is disabled (librechat.yaml sharedLinks),
   the list is always empty. */
section > div > *:has(#shared-links-label),
:is(div, li):has(> div > #shared-links-label) { display: none !important; }

/* Settings → Chat · "Auto-expand tools": would open the tool-call blocks that show internal tool
   names (guardrail C2). */
section > div > *:has(#autoExpandTools) { display: none !important; }

/* Account button (sidebar, "nav-user") · hidden in PRODUCTION only (board 99/100/102). In production
   login/logout belong to the site (SSO embed) and nothing in the menu is needed. The beta keeps it
   (2026-10-23): password logins — the menu shows WHO is logged in (e-mail) and offers Log out to
   switch test accounts (a stale session of another tester's account was mistaken for the operator's
   own on 10-23). Was every-host in edge-v3. */
body[data-zaaz-host="prod"] [data-testid="nav-user"] { display: none !important; }

/* Sidebar · "MCP Settings" button removed on every host (board 101). Per-user MCP configuration is
   never needed here: the agents' tools run server-side from the agent definition. Production also
   stubs GET /api/mcp/servers to {} at the edge (2026-10-14); the beta keeps the real list for the
   admin agent builder, so on the beta only the button goes (CSS), the API stays. */
[data-testid="nav-panel-mcp-builder"] { display: none !important; }

/* Guardrail C2 · internal activity hidden on every host (board 78). The specialist hand-off block
   (specialist name, tool list; a click opened the specialist's internal thread), the main agent's
   tool-call rows + their expandable input/output, grouped tool calls, and the screen-reader echo
   of each running tool ("Running whoami"). Creators see only the answer. Stable LibreChat
   attributes (v0.8.8-rc1): data-subagent-tool-call, data-testid tool-call / tool-call-group-panel,
   data-tool-call-output-id — re-check on every upgrade. */
[data-testid="tool-call"],
[data-tool-call-output-id],
span.sr-only:has(+ [data-testid="tool-call"]),
div:has(> [data-testid="tool-call-group-panel"]),
button[data-subagent-tool-call] { display: none !important; }

/* ===== BETA LAYOUT (board 63, 2026-10-23) — styling only, chatdemo only (body[data-zaaz-host="beta"]).
   Rule for this block: colors, font, background, borders, radius, shadows, spacing, alignment and
   card arrangement ONLY — no display/visibility/pointer-events/position changes, no text replaced,
   no control removed or moved out of reach (verified: same visible + clickable controls before and
   after, landing and conversation). Each step is its own section; drop a section to undo it. */

/* STEP 1 — font (the site's Outfit) + text color */
@font-face { font-family: 'Outfit'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(https://fonts.gstatic.com/s/outfit/v15/QGYvz_MVcBeNP4NJtEtqUYLknw.woff2) format('woff2'); }
body[data-zaaz-host="beta"], body[data-zaaz-host="beta"] *:not(code):not(pre):not(pre *):not(.font-mono) { font-family: 'Outfit', ui-sans-serif, system-ui, sans-serif !important; }
body[data-zaaz-host="beta"] main { color: #1F1B2D; }

/* STEP 2 — light lavender background in the chat area (side bar keeps its own color) */
body[data-zaaz-host="beta"] main, body[data-zaaz-host="beta"] main > div, body[data-zaaz-host="beta"] [data-testid="screenshot-target"] { background-color: #F8F7FB !important; }

/* STEP 3 — agent buttons as cards: 2×2 grid on wide screens, one column on narrow ones */
body[data-zaaz-host="beta"] div.flex-wrap:has(> button.rounded-2xl) { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px !important; align-items: stretch !important; width: 100%; max-width: 760px; margin-left: auto; margin-right: auto; }
body[data-zaaz-host="beta"] div.flex-wrap:has(> button.rounded-2xl) > button.rounded-2xl { width: 100% !important; min-width: 0; max-width: none !important; justify-content: flex-start !important; text-align: left !important; gap: 0 !important; padding: 16px 18px !important; border: 1px solid #E4E1EE !important; border-radius: 16px !important; background-color: #FFFFFF !important; box-shadow: none !important; color: #1F1B2D !important; font-size: 15px !important; }
body[data-zaaz-host="beta"] div.flex-wrap:has(> button.rounded-2xl) > button.rounded-2xl:hover { background-color: #F3F1F9 !important; }
body[data-zaaz-host="beta"] div.flex-wrap:has(> button.rounded-2xl) > button.rounded-2xl::before { content: ""; flex: 0 0 auto; width: 24px; height: 24px; box-sizing: content-box; padding-right: 14px; margin-right: 14px; border-right: 1px solid #E4E1EE; background: center left / 24px 24px no-repeat; }
body[data-zaaz-host="beta"] div.flex-wrap:has(> button.rounded-2xl) > button.rounded-2xl:nth-of-type(1)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233B82F6' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21v-1a7 7 0 0 1 16 0v1'/%3E%3C/svg%3E"); }
body[data-zaaz-host="beta"] div.flex-wrap:has(> button.rounded-2xl) > button.rounded-2xl:nth-of-type(2)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237C3AED' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V10M10 20V4M16 20v-7M22 20H2'/%3E%3C/svg%3E"); }
body[data-zaaz-host="beta"] div.flex-wrap:has(> button.rounded-2xl) > button.rounded-2xl:nth-of-type(3)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23059669' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15 9.2c-.6-.9-1.7-1.4-3-1.4-1.7 0-3 .9-3 2.2 0 3 6 1.6 6 4.4 0 1.3-1.3 2.2-3 2.2-1.4 0-2.6-.6-3.1-1.6M12 6v1.8M12 16.6V18'/%3E%3C/svg%3E"); }
body[data-zaaz-host="beta"] div.flex-wrap:has(> button.rounded-2xl) > button.rounded-2xl:nth-of-type(4)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D97706' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4M8 14h2M14 14h2M8 17.5h2'/%3E%3C/svg%3E"); }
body[data-zaaz-host="beta"] div.flex-wrap:has(> button.rounded-2xl) > button.rounded-2xl[data-zaaz-locked] { position: relative; padding-right: 64px !important; }
body[data-zaaz-host="beta"] div.flex-wrap:has(> button.rounded-2xl) > button.rounded-2xl[data-zaaz-locked]::after { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); margin: 0; }
@media (max-width: 640px) {
  body[data-zaaz-host="beta"] div.flex-wrap:has(> button.rounded-2xl) { grid-template-columns: minmax(0, 1fr); }
  body[data-zaaz-host="beta"] div.flex-wrap:has(> button.rounded-2xl) > button.rounded-2xl { padding: 12px 14px !important; font-size: 14px !important; }
}

/* STEP 4 — message box: white, thin border, rounded corners (all its buttons unchanged) */
body[data-zaaz-host="beta"] form .relative.flex.w-full.flex-grow.flex-col.overflow-hidden { border: 1px solid #E4E1EE !important; border-radius: 16px !important; background-color: #FFFFFF !important; box-shadow: 0 1px 2px rgba(31,27,45,.04) !important; }

/* STEP 5 — the creator's message as a purple bubble (not while editing it) */
body[data-zaaz-host="beta"] .user-turn [data-testid="message-body"]:not(:has(textarea)) { background-color: #4A2E6E !important; border-radius: 16px !important; padding: 14px 18px !important; box-shadow: 0 6px 18px rgba(74,46,110,.16); }
body[data-zaaz-host="beta"] .user-turn [data-testid="message-body"]:not(:has(textarea)) .markdown,
body[data-zaaz-host="beta"] .user-turn [data-testid="message-body"]:not(:has(textarea)) .markdown * { color: #FFFFFF !important; }

/* ===== BETA UI DECISIONS (product call 2026-10-27, board 103/104) — chatdemo only. Not layout: these
   two remove controls on purpose, as decided with product. */
/* Light mode only: the edge forces LibreChat's own `color-theme` = light before the app loads
   (Caddyfile, chatdemo block); the Settings › General › Theme row goes, so it cannot be switched back. */
body[data-zaaz-host="beta"] div:has(> div > #theme-selector-label) { display: none !important; }
/* Agent selector at the top hidden: one orchestrator agent (enforced server-side); the agent buttons
   route the workflows. */
body[data-zaaz-host="beta"] [data-testid="model-selector-button"] { display: none !important; }
