/* ecosystem-sidecar.css — visual adjustments when the page is embedded
 * inside a master app's sidecar iframe (2026-09-24 · CAW).
 *
 * Trigger: html[data-sidecar="1"] — set by ecosystem-bridge.js on load
 * when the URL includes ?sidecar=1. Companion apps hide their own topbar
 * and nav chrome so the master's chrome remains the only navigation shell.
 *
 * Do NOT put functional overrides here — only presentational hiding of
 * outer chrome. Content, tables, and interactive elements stay untouched.
 */

/* Hide topbar / global nav / footer when embedded — they're redundant
 * inside the master app's drawer. Keep specific per-app selectors below. */
html[data-sidecar="1"] .topbar,
html[data-sidecar="1"] .site-topbar,
html[data-sidecar="1"] .global-nav,
html[data-sidecar="1"] header.site-header,
html[data-sidecar="1"] .presenter-panel,
html[data-sidecar="1"] .floating-chat,
html[data-sidecar="1"] .coach-chip,
html[data-sidecar="1"] .app-footer,
html[data-sidecar="1"] footer.site-footer {
  display: none !important;
}

/* Reduce outer padding — the master drawer already provides margins. */
html[data-sidecar="1"] body {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
html[data-sidecar="1"] main,
html[data-sidecar="1"] .app-main,
html[data-sidecar="1"] .container {
  padding-top: 12px !important;
}

/* Sidecar phone viewport = full-width drawer bottom sheet. Tighten gutters. */
html[data-sidecar="1"][data-viewport="phone"] main,
html[data-sidecar="1"][data-viewport="phone"] .container {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

/* Suppress fixed elements that would collide with the master drawer edges. */
html[data-sidecar="1"] .fixed-bottom,
html[data-sidecar="1"] .floating-panel-fixed {
  position: static !important;
}

/* ────────────────────────────────────────────────────────────────────────
 * 2026-09-24 · OAuth-in-sidecar escape hatch.
 * Google/Microsoft/etc. login pages set X-Frame-Options: DENY, so an OAuth
 * redirect inside an iframe silently blanks. Companion login templates
 * include partials/sidecar_oauth_prompt.html which renders this overlay
 * ONLY when data-sidecar="1". User clicks "Open in tab to sign in" →
 * new tab handles OAuth → returns cookie → user re-hits master's chip.
 * ──────────────────────────────────────────────────────────────────────── */
.eco-oauth-prompt { display: none; }
html[data-sidecar="1"] .eco-oauth-prompt {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  min-height: 60vh; padding: 24px 32px;
  text-align: center;
  color: var(--bp-ink, #1a1a1a);
  background: var(--bp-surface, #fff);
}
html[data-sidecar="1"] .eco-oauth-prompt h2 {
  font-family: 'Libre Baskerville', Georgia, serif;
  font-size: 1.05rem; margin-bottom: 10px;
  color: var(--bp-brand, #502379);
}
html[data-sidecar="1"] .eco-oauth-prompt p {
  font-size: 0.92rem; line-height: 1.5;
  max-width: 380px; margin-bottom: 20px;
  color: var(--bp-ink-mid, #444);
}
html[data-sidecar="1"] .eco-oauth-prompt a.eco-oauth-cta {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 18px;
  background: var(--bp-accent, #009B3A);
  color: var(--bp-on-primary, #fff);
  text-decoration: none;
  border-radius: 4px;
  font-weight: 600; font-size: 0.9rem;
  border: 1px solid var(--bp-accent, #009B3A);
}
html[data-sidecar="1"] .eco-oauth-prompt a.eco-oauth-cta:hover {
  filter: brightness(1.1);
}
/* Suppress the app's own login form inside the sidecar. The overlay above
 * replaces it. Companion apps mark their form with .app-login-form or
 * .login-container and this hides it when sidecar mode is active. */
html[data-sidecar="1"] .app-login-form,
html[data-sidecar="1"] .login-container,
html[data-sidecar="1"] form[action*="/login"] {
  display: none !important;
}