/* Shared workspace chrome — Sprint 6.1 */
/* Sprint 13: .agcc-logo-* moved to app.css — the logo renders on every page
 * (incl. Home, which does not load this file), so it belongs in the base sheet. */

.ws-back-link {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  margin-bottom: var(--space-3);
  border-radius: var(--radius-lg);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
  text-decoration: none;
  transition: background var(--transition-base);
}

.ws-back-link:hover { background: var(--color-gray-50); color: var(--color-text-primary); }

.ws-workspace-label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0 var(--space-3);
  margin-bottom: var(--space-2);
}

.ws-workspace-badge {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin: 0 var(--space-2) var(--space-3);
  padding: var(--space-2) var(--space-3);
  background: var(--color-primary-50);
  color: var(--color-primary-700);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
}

.ws-nav-item { width: 100%; border: none; background: none; cursor: pointer; font-family: var(--font-family); text-align: left; }

/* ── Collapsible nav groups (P2 enterprise navigation) ───────────────────── */
.ws-nav-group { margin-bottom: 2px; }
.ws-nav-group-toggle {
  display: flex; align-items: center; gap: var(--space-2); width: 100%;
  padding: var(--space-2) var(--space-3);
  border: none; background: none; cursor: pointer; font-family: var(--font-family);
  font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary); border-radius: var(--radius-md); text-align: left;
}
.ws-nav-group-toggle:hover { background: var(--color-surface-hover); color: var(--color-text-primary); }
.ws-nav-caret { margin-left: auto; transition: transform var(--transition-base); opacity: .55; }
.ws-nav-group.open > .ws-nav-group-toggle .ws-nav-caret { transform: rotate(180deg); }
/* primary-700 primitive cannot flip; measured 2.65:1 on the dark sidebar. */
.ws-nav-group.active > .ws-nav-group-toggle { color: var(--color-text-accent); }
.ws-nav-group-items { display: none; padding-top: 2px; }
.ws-nav-group.open > .ws-nav-group-items { display: block; }
.ws-nav-sub {
  padding-left: calc(var(--space-3) + 22px) !important;
  font-size: var(--font-size-sm);
}

/* ── Global product switcher ─────────────────────────────────────────────── */
.ws-switcher { position: relative; margin: 0 var(--space-2) var(--space-3); }
.ws-switcher-btn {
  display: flex; align-items: center; gap: var(--space-2); width: 100%;
  padding: var(--space-2) var(--space-3);
  background: var(--color-primary-50); color: var(--color-primary-700);
  border: 1px solid transparent; border-radius: var(--radius-md);
  font-family: var(--font-family); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold);
  cursor: pointer; text-align: left;
}
.ws-switcher-btn:hover { border-color: var(--color-primary-200, #bfdbfe); }
.ws-switcher-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ws-switcher-menu {
  position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 40;
  background: var(--color-white, #fff); border: 1px solid var(--color-border, #e5e7eb);
  border-radius: var(--radius-xl, 14px); box-shadow: var(--shadow-xl);
  padding: 6px; max-height: 60vh; overflow-y: auto;
}
.ws-switcher-head {
  font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--color-text-muted); padding: 6px 8px 4px;
}
.ws-switcher-item {
  display: flex; align-items: center; gap: 9px; padding: 8px 8px; border-radius: 8px;
  font-size: 13px; color: var(--color-text-primary); text-decoration: none;
}
.ws-switcher-item:hover { background: var(--color-gray-50); }
.ws-switcher-item.active { background: var(--color-primary-50); color: var(--color-primary-700); font-weight: 600; }
.ws-switcher-item-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ws-switcher-check { margin-left: auto; color: var(--color-primary-600); }
.ws-switcher-preview {
  margin-left: auto; font-size: 12px; letter-spacing: .05em; text-transform: uppercase;
  color: var(--color-text-muted); border: 1px solid var(--color-border); border-radius: 5px; padding: 1px 5px;
}

/* ── Global search trigger (opens ⌘K palette) ────────────────────────────── */
.ws-search-trigger {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px; min-width: 180px;
  background: var(--color-surface-sunken, #f9fafb); border: 1px solid var(--color-border, #e5e7eb);
  border-radius: var(--radius-md, 8px); cursor: pointer; font-family: var(--font-family);
  font-size: 13px; color: var(--color-text-muted, #6b7280);
}
.ws-search-trigger:hover { border-color: var(--color-primary-300, #93c5fd); color: var(--color-text-secondary); }
.ws-search-trigger-text { flex: 1; text-align: left; }
.ws-search-kbd {
  font-size: 12px; border: 1px solid var(--color-border, #e5e7eb); border-radius: 5px;
  padding: 1px 5px; color: var(--color-text-muted, #9ca3af); font-family: inherit;
}
@media (max-width: 767px) { .ws-search-trigger-text, .ws-search-kbd { display: none; } .ws-search-trigger { min-width: 0; } }

/* ── Shared workspace context bar (Region · Marketplace · Brand · Time Range) ─ */
.ws-context-bar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 8px var(--space-6); background: var(--color-surface-chrome, #fff);
  border-bottom: 1px solid var(--color-border, #e5e7eb);
}
.ws-ctx-lead {
  display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600;
  letter-spacing: .05em; text-transform: uppercase; color: var(--color-text-muted, #6b7280);
}
.ws-ctx-field {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 8px; background: var(--color-gray-50, #f9fafb);
  border: 1px solid var(--color-border, #e5e7eb); border-radius: var(--radius-md, 8px);
  color: var(--color-text-secondary, #4b5563);
}
.ws-ctx-flabel { font-size: 12px; font-weight: 600; color: var(--color-text-muted, #6b7280); }
.ws-ctx-select {
  border: none; background: transparent; font-family: var(--font-family); font-size: 13px;
  color: var(--color-text-primary, #111827); cursor: pointer; outline: none; max-width: 160px;
}
/* A dimension with no real data yet: shown but visibly inert, so the user knows the filter
   exists and why it's unavailable — never a live dropdown whose only choice is "All …". */
.ws-ctx-field--empty { opacity: .6; }
.ws-ctx-field--empty .ws-ctx-select { cursor: not-allowed; color: var(--color-text-muted, #6b7280); font-style: italic; }
.ws-ctx-reset {
  margin-left: auto; border: none; background: none; cursor: pointer;
  font-family: var(--font-family); font-size: 12px; color: var(--color-text-muted, #6b7280);
  padding: 4px 8px; border-radius: 6px;
}
.ws-ctx-reset:hover { background: var(--color-gray-50, #f9fafb); color: var(--color-text-secondary); }
@media (max-width: 767px) { .ws-context-bar { padding: 8px var(--space-4); } .ws-ctx-flabel { display: none; } }

.ws-topbar-title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-primary);
}

.ws-topbar-subtitle {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
}

.ws-main-wrapper {
  margin-left: var(--sidebar-width);
  min-height: 100vh;
}

.ws-page-content { padding: var(--space-6); }

.ws-global-link { text-decoration: none; color: inherit; }

.ws-reveal { opacity: 0; transform: translateY(12px); transition: opacity 520ms var(--transition-spring, cubic-bezier(.2,.8,.2,1)) var(--ws-reveal-delay, 0ms), transform 520ms var(--transition-spring, cubic-bezier(.2,.8,.2,1)) var(--ws-reveal-delay, 0ms); }
.ws-reveal--visible { opacity: 1; transform: translateY(0); }

#ws-root { min-height: 100vh; }

.ri-sidebar-item {
  width: 100%;
  border: none;
  background: none;
  cursor: pointer;
  font-family: var(--font-family);
  text-align: left;
}

.ws-page-content--flush { padding: 0; }

.ws-page-content .ri-seo-workspace {
  min-height: calc(100vh - var(--header-height));
}

.ws-sidebar-footer { display: flex; align-items: center; gap: 10px; padding: 14px 16px 18px; border-top: 1px solid var(--color-border-subtle); background: rgba(255, 255, 255, .62); }
.ws-sidebar-footer strong, .ws-sidebar-footer span { display: block; }
.ws-sidebar-footer strong { color: var(--color-text-primary); font-size: 11px; font-weight: 700; }
.ws-sidebar-footer div span { margin-top: 2px; color: var(--color-text-muted); font-size: 11px; }
.ws-footer-orbit { position: relative; display: block; width: 30px; height: 30px; flex: none; border: 1px solid var(--color-primary-200); border-radius: 50%; background: var(--color-primary-50); }
.ws-footer-orbit::before, .ws-footer-orbit::after { content: ''; position: absolute; inset: 6px; border: 1px solid var(--color-primary-300); border-radius: 50%; transform: rotate(45deg) scaleX(1.35); }
.ws-footer-orbit::after { transform: rotate(-45deg) scaleX(1.35); }
.ws-footer-orbit i { position: absolute; z-index: 1; width: 4px; height: 4px; border-radius: 50%; background: var(--color-primary-600); }
.ws-footer-orbit i:nth-child(1) { top: 4px; left: 12px; }
.ws-footer-orbit i:nth-child(2) { right: 4px; bottom: 8px; background: var(--color-success-600); }
.ws-footer-orbit i:nth-child(3) { left: 5px; bottom: 7px; background: var(--color-warning-600); }
.ws-live-state { display: inline-flex; align-items: center; gap: 7px; padding: 6px 9px; border: 1px solid var(--color-border); border-radius: var(--radius-full); background: var(--color-surface-raised); color: var(--color-text-muted); font-size: 11px; font-weight: 600; white-space: nowrap; }
.ws-live-state i { width: 6px; height: 6px; border-radius: 50%; background: var(--color-gray-400); }
.ws-live-state[data-state="online"] { color: var(--color-success-700); border-color: var(--color-success-200); background: var(--color-success-50); }
.ws-live-state[data-state="online"] i { background: var(--color-success-600); box-shadow: 0 0 0 4px var(--color-success-100); }
.ws-live-state[data-state="local"] { background: var(--color-gray-50); }
.ws-topbar-title { font-size: 15px; letter-spacing: -.01em; }
.ws-topbar-subtitle { margin-top: 1px; }
.ws-context-bar { position: relative; z-index: 2; background: rgba(255, 255, 255, .86); }
.ws-search-trigger { box-shadow: var(--shadow-xs); transition: border-color var(--transition-base), box-shadow var(--transition-base), background var(--transition-base); }
.ws-search-trigger:hover { background: var(--color-surface-raised); box-shadow: var(--shadow-sm); }
@media (max-width: 1023px) { .ws-sidebar-footer { display: none; } }
@media (max-width: 767px) { .ws-live-state { display: none; } }
@media (max-width: 767px) {
  .ws-topbar { height: 64px; min-height: 64px; }
  .ws-topbar .topbar-left { min-width: 0; overflow: hidden; }
  .ws-topbar .topbar-left > div:last-child { min-width: 0; overflow: hidden; }
  .ws-topbar-title { overflow: hidden; max-width: 156px; text-overflow: ellipsis; white-space: nowrap; }
  .ws-topbar-subtitle { display: none; }
  .ws-topbar .topbar-actions { flex: 0 0 auto; gap: 5px; }
  .ws-topbar .ws-global-link { display: none; }
  .ws-topbar #agcc-account-ctl { font-size: 12px !important; }
}
@media (prefers-reduced-motion: reduce) { .ws-reveal { opacity: 1; transform: none; transition: none; } }

@media (max-width: 1023px) {
  .ws-main-wrapper { margin-left: 0; }
}
/* Sprint 8 — Executive Dashboard live-aggregation UI */
.exec-source-note {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 16px 0 0;
  font-size: 12px;
  color: var(--color-text-muted, #6B7280);
}
.exec-muted {
  margin: 0;
  font-size: var(--font-size-sm, 13px);
  color: var(--color-text-secondary, #4B5563);
}
.exec-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 48px 24px;
  text-align: center;
  background: var(--color-surface-raised, #fff);
  border: 1px dashed var(--color-border-strong, #D1D5DB);
  border-radius: var(--radius-xl, 14px);
  color: var(--color-text-secondary, #4B5563);
}
.exec-empty h3 { margin: 0; font-size: 16px; color: var(--color-text-primary, #111827); }
.exec-empty p { margin: 0; max-width: 520px; font-size: 13px; }
.exec-empty i { color: var(--color-gray-400, #9CA3AF); }
/* Shared empty states (improvement #10) — see js/shared/components.js.
 * Tone is the point of the styling: a true zero is a settled answer and reads
 * calm, while an unreachable source is a problem and reads like one. Making
 * those two look identical is what let BUG-002 pass as a finding. */
.agcc-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 44px 24px;
  text-align: center;
  background: var(--color-surface-raised, #fff);
  border: 1px dashed var(--color-border-strong, #D1D5DB);
  border-radius: var(--radius-xl, 14px);
  color: var(--color-text-secondary, #4B5563);
}
.agcc-empty__title { margin: 0; font-size: 16px; font-weight: 600; color: var(--color-text-primary, #111827); }
.agcc-empty__body { margin: 0; max-width: 540px; font-size: var(--font-size-sm, 13px); line-height: 1.55; }
.agcc-empty__note {
  margin: 0;
  max-width: 540px;
  font-size: var(--font-size-xs, 12px);
  color: var(--color-text-tertiary, #6B7280);
}
.agcc-empty__icon { color: var(--color-gray-400, #9CA3AF); line-height: 0; }
.agcc-empty__actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 4px; }
/* A source failure is not a neutral outcome — it gets a solid, warmer edge so it
 * is distinguishable from a genuine zero at a glance, before reading a word. */
.agcc-empty--warn {
  border-style: solid;
  border-color: var(--color-warning-300, #FCD34D);
  background: var(--color-warning-50, #FFFBEB);
}
.agcc-empty--warn .agcc-empty__icon { color: var(--color-warning-600, #D97706); }
.agcc-empty--info {
  border-style: solid;
  border-color: var(--color-primary-200, #C7D2FE);
  background: var(--color-primary-50, #EEF2FF);
}
.agcc-empty--info .agcc-empty__icon { color: var(--color-primary-600, #4F46E5); }

.exec-funnel { display: flex; flex-direction: column; gap: 8px; }
.exec-funnel-row { display: flex; align-items: center; gap: 12px; }
.exec-funnel-label { width: 110px; font-size: 12px; color: var(--color-text-secondary, #4B5563); }
.exec-funnel-track { flex: 1; height: 10px; background: var(--color-gray-100, #F3F4F6); border-radius: 5px; overflow: hidden; }
.exec-funnel-fill { height: 100%; background: #2563EB; border-radius: 5px; }
.exec-funnel-count { width: 32px; text-align: right; font-size: 12px; font-weight: 600; color: var(--color-text-primary, #111827); }

/* Sprint 13 - executive narrative summary (P1-3) */
.exec-narrative {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  background: var(--color-surface-raised, #fff);
  border: 1px solid var(--color-border, #E5E7EB);
  border-left: 3px solid var(--color-primary-600, #2563EB);
  border-radius: var(--radius-xl, 14px);
  box-shadow: var(--shadow-xs);
  padding: 14px 18px;
  margin-bottom: 20px;
}
.exec-narrative i { color: var(--color-primary-600, #2563EB); flex-shrink: 0; margin-top: 3px; }
.exec-narrative p { margin: 0; font-size: 14px; line-height: 1.65; color: var(--color-text-secondary, #374151); }
.exec-narrative strong { color: var(--color-text-primary, #111827); }

/* Phase 1 — platform-contract module cards (product-agnostic snapshot aggregation) */
.exec-modules { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.exec-mod-card {
  display: flex; flex-direction: column; gap: 12px;
  background: var(--color-surface-raised, #fff);
  border: 1px solid var(--color-border, #E5E7EB);
  border-radius: var(--radius-xl, 14px);
  box-shadow: var(--shadow-xs);
  padding: 16px;
  transition: box-shadow var(--transition-base), border-color var(--transition-base);
}
.exec-mod-card:hover { box-shadow: var(--shadow-md); border-color: var(--color-border-strong, #D1D5DB); }
.exec-mod-head { display: flex; align-items: center; gap: 10px; }
.exec-mod-ic {
  display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; flex: none;
  border-radius: 8px; background: var(--color-primary-50, #EFF6FF); color: var(--color-primary-600, #2563EB);
}
.exec-mod-name { font-size: 14px; font-weight: 600; color: var(--color-text-primary, #111827); }
.exec-mod-health {
  margin-left: auto; display: inline-flex; align-items: center; gap: 4px;
  font-size: 12px; font-weight: 600; padding: 3px 8px; border-radius: 999px; white-space: nowrap;
}
.exec-mod-health.healthy { background: #ECFDF5; color: #047857; }
.exec-mod-health.degraded { background: #FFFBEB; color: #B45309; }
.exec-mod-health.down { background: var(--color-gray-100, #F3F4F6); color: var(--color-text-muted, #6B7280); }
.exec-mod-kpis { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.exec-mod-kpi { background: var(--color-gray-50, #F9FAFB); border-radius: var(--radius-md, 8px); padding: 10px 12px; }
.exec-mod-kpi-val { font-size: 18px; font-weight: 700; color: var(--color-text-primary, #111827); font-variant-numeric: tabular-nums; }
.exec-mod-kpi-lbl { font-size: 12px; color: var(--color-text-muted, #6B7280); margin-top: 2px; }
.exec-mod-none { margin: 0; font-size: 12px; color: var(--color-text-muted, #6B7280); }
.exec-mod-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; }
.exec-mod-open { font-size: 13px; font-weight: 600; color: var(--color-primary-600, #2563EB); text-decoration: none; }
.exec-mod-open:hover { text-decoration: underline; }
.exec-mod-when { font-size: 12px; color: var(--color-text-muted, #9CA3AF); }

/* ── Score provenance tag (improvement #2) ───────────────────────────────────
   One shared idiom for "was this number measured or modelled, and when". Four
   competing ones existed before: .ri-seo-est-tag, .mp-conf-info, a bespoke
   "measured" badge, and bare title="" text. Rendered by agccProvenanceTag() in
   js/shared/metric-info.js, which loads on every workspace page.
   Muted by design — provenance should be legible, never louder than the value. */
.agcc-prov {
  display: inline-flex; align-items: center; gap: 4px;
  margin-left: 6px; padding: 1px 7px;
  border: 1px solid var(--color-border, #e5e7eb); border-radius: 999px;
  font-size: 11px; font-weight: 700; font-style: normal; white-space: nowrap;
  vertical-align: middle; cursor: help;
  color: var(--color-text-muted, #6b7280); background: var(--color-surface, #f9fafb);
  /* KPI tiles are flex columns; an inline-flex child would otherwise stretch the full
     card width and read as a banner rather than a quiet qualifier on the number. */
  align-self: flex-start; width: -moz-fit-content; width: fit-content; max-width: 100%;
  text-transform: none; letter-spacing: normal;
}
.agcc-prov::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; opacity: .75; }
.agcc-prov--ok    { color: #047857; background: #ecfdf5; border-color: #a7f3d0; }
.agcc-prov--warn  { color: #92400e; background: #fffbeb; border-color: #fde68a; }
.agcc-prov--muted { color: #6b7280; background: #f9fafb; border-color: #e5e7eb; }
@media (prefers-color-scheme: dark) {
  .agcc-prov--ok    { color: #6ee7b7; background: rgba(6,78,59,.35);  border-color: rgba(16,185,129,.35); }
  .agcc-prov--warn  { color: #fcd34d; background: rgba(120,53,15,.35); border-color: rgba(245,158,11,.35); }
  .agcc-prov--muted { color: #9ca3af; background: rgba(31,41,55,.5);   border-color: rgba(75,85,99,.5); }
}
