/* WCP-OPS v1 — Operational Console + Weviavatar Exec
 * D1291 — Owned Opus D1291 — full operational hub
 * Pairs with wcp-premium-v1.css (shares :root tokens)
 */

.wcp-ops {
  max-width: 1280px;
  margin: 3rem auto;
  padding: 0 1.5rem;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  color: #1F2937;
  --wo-primary: #0F766E;
  --wo-primary-deep: #0B5953;
  --wo-accent: #B45309;
  --wo-success: #047857;
  --wo-danger: #B91C1C;
  --wo-text-strong: #0B1620;
  --wo-text: #1F2937;
  --wo-text-soft: #4B5563;
  --wo-text-mute: #6B7280;
  --wo-border: #E5E7EB;
  --wo-border-strong: #D1D5DB;
  --wo-surface: #FFFFFF;
  --wo-surface-2: #FAFAF9;
  --wo-surface-3: #F5F5F4;
  --wo-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
  --wo-shadow-md: 0 4px 12px rgba(15, 23, 42, 0.06), 0 2px 4px rgba(15, 23, 42, 0.04);
  --wo-shadow-lg: 0 10px 30px rgba(15, 23, 42, 0.08);
  --wo-ease: cubic-bezier(0.4, 0, 0.2, 1);
}

/* D753 compliant header */
.wcp-ops .wo-eyebrow {
  font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--wo-primary);
  margin: 0 0 0.625rem; display: inline-flex; align-items: center; gap: 0.4rem;
}
.wcp-ops .wo-eyebrow::before { content:''; width:24px; height:1px; background:var(--wo-primary); opacity:0.6; }
.wcp-ops .wo-h2 {
  font-size: clamp(1.625rem, 2.6vw, 2.125rem); font-weight: 700;
  letter-spacing: -0.025em; line-height: 1.15; color: var(--wo-text-strong);
  margin: 0 0 0.75rem;
}
.wcp-ops .wo-sub { font-size: 0.95rem; color: var(--wo-text-soft); margin: 0 0 1.25rem; max-width: 720px; }
.wcp-ops .wo-underline { height: 2px; width: 56px; background: var(--wo-primary); margin-bottom: 2rem; border-radius: 1px; }

/* Grid: composer (2/3) + proposals (1/3) */
.wcp-ops .wo-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 1.25rem;
}
@media (max-width: 880px) { .wcp-ops .wo-grid { grid-template-columns: 1fr; } }

/* Composer card */
.wcp-ops .wo-composer {
  background: var(--wo-surface);
  border: 1px solid var(--wo-border);
  border-radius: 16px;
  padding: 1.5rem;
  box-shadow: var(--wo-shadow-sm);
}
.wcp-ops .wo-composer-title {
  font-size: 1rem; font-weight: 700; letter-spacing: -0.02em;
  color: var(--wo-text-strong); margin: 0 0 0.25rem;
  display: flex; align-items: center; gap: 0.5rem;
}
.wcp-ops .wo-composer-title::before {
  content: ''; width: 4px; height: 16px; background: var(--wo-primary); border-radius: 2px;
}
.wcp-ops .wo-composer-meta { font-size: 0.78rem; color: var(--wo-text-mute); margin-bottom: 1.25rem; }

/* Form fields */
.wcp-ops .wo-row { display: grid; gap: 0.875rem; }
.wcp-ops .wo-row.cols-2 { grid-template-columns: 1fr 1fr; }
.wcp-ops .wo-row.cols-3 { grid-template-columns: 1fr 1fr 1fr; }
@media (max-width: 600px) { .wcp-ops .wo-row.cols-2, .wcp-ops .wo-row.cols-3 { grid-template-columns: 1fr; } }

.wcp-ops .wo-field { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; }
.wcp-ops .wo-label {
  font-size: 0.72rem; font-weight: 600; letter-spacing: 0.04em;
  text-transform: uppercase; color: var(--wo-text-mute);
}
.wcp-ops .wo-input,
.wcp-ops .wo-select,
.wcp-ops .wo-textarea {
  width: 100%;
  border: 1px solid var(--wo-border);
  border-radius: 8px;
  padding: 0.6rem 0.75rem;
  font-size: 0.92rem;
  color: var(--wo-text);
  background: var(--wo-surface);
  font-family: inherit;
  transition: border-color 0.2s var(--wo-ease), box-shadow 0.2s var(--wo-ease);
  box-sizing: border-box;
}
.wcp-ops .wo-textarea { min-height: 96px; resize: vertical; font-family: inherit; }
.wcp-ops .wo-input:focus,
.wcp-ops .wo-select:focus,
.wcp-ops .wo-textarea:focus {
  outline: none;
  border-color: var(--wo-primary);
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.12);
}

/* Pill / chip group (multi-select friendly) */
.wcp-ops .wo-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.wcp-ops .wo-chip {
  font-size: 0.78rem; font-weight: 500;
  padding: 0.35rem 0.7rem; border-radius: 999px;
  background: var(--wo-surface-3); color: var(--wo-text-soft);
  border: 1px solid transparent; cursor: pointer;
  transition: all 0.18s var(--wo-ease); user-select: none;
}
.wcp-ops .wo-chip:hover { background: #EAEAE9; color: var(--wo-text); }
.wcp-ops .wo-chip.active {
  background: var(--wo-primary); color: white; font-weight: 600;
}
.wcp-ops .wo-chip.active:hover { background: var(--wo-primary-deep); }

/* Action bar */
.wcp-ops .wo-actions {
  display: flex; flex-wrap: wrap; gap: 0.6rem;
  margin-top: 1.25rem; padding-top: 1.25rem;
  border-top: 1px solid var(--wo-border);
}
.wcp-ops .wo-btn {
  font-family: inherit; font-size: 0.88rem; font-weight: 600;
  letter-spacing: -0.005em;
  padding: 0.6rem 1.1rem; border-radius: 9px;
  cursor: pointer; border: 1px solid transparent;
  transition: all 0.2s var(--wo-ease);
  display: inline-flex; align-items: center; gap: 0.45rem;
  white-space: nowrap;
}
.wcp-ops .wo-btn.primary {
  background: var(--wo-primary); color: white;
  box-shadow: 0 1px 2px rgba(15, 118, 110, 0.3);
}
.wcp-ops .wo-btn.primary:hover {
  background: var(--wo-primary-deep);
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(15, 118, 110, 0.25);
}
.wcp-ops .wo-btn.secondary {
  background: var(--wo-surface); color: var(--wo-text);
  border-color: var(--wo-border-strong);
}
.wcp-ops .wo-btn.secondary:hover { background: var(--wo-surface-2); border-color: var(--wo-text-mute); }
.wcp-ops .wo-btn.ghost { background: transparent; color: var(--wo-text-soft); }
.wcp-ops .wo-btn.ghost:hover { background: var(--wo-surface-3); color: var(--wo-text); }
.wcp-ops .wo-btn.danger { background: var(--wo-danger); color: white; }
.wcp-ops .wo-btn.danger:hover { filter: brightness(0.92); }
.wcp-ops .wo-btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none !important; }
.wcp-ops .wo-btn-icon {
  width: 14px; height: 14px;
  display: inline-flex; align-items: center; justify-content: center;
}

/* Proposals panel */
.wcp-ops .wo-proposals { display: flex; flex-direction: column; gap: 0.75rem; }
.wcp-ops .wo-proposal-head {
  font-size: 0.72rem; font-weight: 600; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--wo-accent);
  display: flex; align-items: center; gap: 0.5rem;
}
.wcp-ops .wo-proposal-head::before {
  content: ''; display: inline-block; width: 6px; height: 6px;
  border-radius: 50%; background: var(--wo-accent);
  box-shadow: 0 0 0 3px rgba(180, 83, 9, 0.18);
}
.wcp-ops .wo-proposal {
  background: var(--wo-surface); border: 1px solid var(--wo-border);
  border-radius: 12px; padding: 1rem 1.1rem; cursor: pointer;
  transition: all 0.22s var(--wo-ease); position: relative;
}
.wcp-ops .wo-proposal:hover {
  border-color: var(--wo-primary);
  box-shadow: var(--wo-shadow-md);
  transform: translateY(-2px);
}
.wcp-ops .wo-proposal-title {
  font-size: 0.92rem; font-weight: 600; letter-spacing: -0.015em;
  color: var(--wo-text-strong); margin-bottom: 0.35rem;
}
.wcp-ops .wo-proposal-detail { font-size: 0.81rem; color: var(--wo-text-soft); line-height: 1.45; margin-bottom: 0.55rem; }
.wcp-ops .wo-proposal-foot {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 0.72rem; color: var(--wo-text-mute);
}
.wcp-ops .wo-confidence {
  display: inline-flex; align-items: center; gap: 0.3rem;
  font-weight: 600; padding: 0.18rem 0.5rem;
  border-radius: 6px; background: var(--wo-surface-3);
}
.wcp-ops .wo-confidence.high { color: var(--wo-success); background: rgba(4, 120, 87, 0.08); }
.wcp-ops .wo-confidence.med { color: var(--wo-accent); background: rgba(180, 83, 9, 0.08); }
.wcp-ops .wo-confidence.low { color: var(--wo-text-mute); }

/* Toast */
.wcp-ops .wo-toast,
.wv-toast {
  position: fixed; bottom: 88px; right: 20px; z-index: 10001;
  background: #0B1620; color: white;
  padding: 0.7rem 1.1rem; border-radius: 10px;
  font-size: 0.88rem; font-weight: 500;
  box-shadow: 0 8px 24px rgba(0,0,0,0.25);
  display: flex; align-items: center; gap: 0.5rem;
  opacity: 0; transform: translateY(8px);
  transition: all 0.3s var(--wo-ease);
  font-family: 'Inter', sans-serif;
  max-width: 380px;
}
.wcp-ops .wo-toast.show,
.wv-toast.show { opacity: 1; transform: translateY(0); }
.wcp-ops .wo-toast.success::before,
.wv-toast.success::before { content:''; width: 8px; height: 8px; border-radius: 50%; background: #10B981; }
.wcp-ops .wo-toast.error::before,
.wv-toast.error::before { content:''; width: 8px; height: 8px; border-radius: 50%; background: #EF4444; }

/* === Weviavatar (global, fixed) === */
.wv-bubble {
  position: fixed; bottom: 24px; right: 24px; z-index: 9999;
  width: 64px; height: 64px; border-radius: 50%;
  background: linear-gradient(135deg, #0F766E, #0B5953);
  color: white;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(15, 118, 110, 0.35), 0 2px 6px rgba(15, 118, 110, 0.2);
  font-family: 'Inter', sans-serif; font-weight: 700; font-size: 1.05rem;
  letter-spacing: -0.02em;
  transition: transform 0.25s cubic-bezier(0.4,0,0.2,1), box-shadow 0.25s;
  border: 2px solid rgba(255, 255, 255, 0.18);
}
.wv-bubble:hover { transform: scale(1.06) translateY(-1px); box-shadow: 0 12px 32px rgba(15, 118, 110, 0.45); }
.wv-bubble.open { transform: scale(0.9); }
.wv-bubble::after {
  content: ''; position: absolute; top: 4px; right: 4px;
  width: 10px; height: 10px; border-radius: 50%;
  background: #34D399; box-shadow: 0 0 0 2px white, 0 0 0 4px rgba(52, 211, 153, 0.3);
  animation: wvPulse 2.4s cubic-bezier(0.4,0,0.2,1) infinite;
}
.wv-bubble-text { font-size: 0.95rem; letter-spacing: 0.02em; }
@keyframes wvPulse {
  0%, 100% { box-shadow: 0 0 0 2px white, 0 0 0 4px rgba(52, 211, 153, 0.3); }
  50% { box-shadow: 0 0 0 2px white, 0 0 0 8px rgba(52, 211, 153, 0.05); }
}

/* Panel */
.wv-panel {
  position: fixed; bottom: 100px; right: 24px; z-index: 9998;
  width: min(420px, calc(100vw - 32px));
  height: min(620px, calc(100vh - 140px));
  background: white; border-radius: 18px;
  box-shadow: 0 18px 50px rgba(15, 23, 42, 0.2), 0 4px 12px rgba(15, 23, 42, 0.08);
  display: flex; flex-direction: column; overflow: hidden;
  opacity: 0; transform: translateY(12px) scale(0.98); pointer-events: none;
  transition: all 0.28s cubic-bezier(0.4,0,0.2,1);
  font-family: 'Inter', sans-serif;
  border: 1px solid rgba(15, 23, 42, 0.06);
}
.wv-panel.open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }

.wv-head {
  padding: 1rem 1.1rem; background: linear-gradient(135deg, #0F766E, #0B5953);
  color: white; display: flex; align-items: center; justify-content: space-between;
}
.wv-head-info { display: flex; align-items: center; gap: 0.7rem; }
.wv-head-av {
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(255, 255, 255, 0.15); display: flex;
  align-items: center; justify-content: center;
  font-weight: 700; font-size: 0.85rem; letter-spacing: -0.02em;
}
.wv-head-title { font-weight: 700; font-size: 0.92rem; letter-spacing: -0.015em; }
.wv-head-sub { font-size: 0.7rem; opacity: 0.85; letter-spacing: 0.02em; }
.wv-head-close {
  background: none; border: none; color: white; opacity: 0.85;
  cursor: pointer; font-size: 1.3rem; padding: 0.15rem 0.5rem;
  border-radius: 6px; transition: background 0.18s;
}
.wv-head-close:hover { background: rgba(255, 255, 255, 0.12); opacity: 1; }
.wv-context-badge {
  font-size: 0.65rem; padding: 0.2rem 0.5rem; border-radius: 5px;
  background: rgba(255, 255, 255, 0.16); margin-top: 0.25rem;
  display: inline-block; letter-spacing: 0.06em; text-transform: uppercase; font-weight: 600;
}

.wv-conv {
  flex: 1; overflow-y: auto;
  padding: 1rem 1.1rem; background: #FAFAF9;
  display: flex; flex-direction: column; gap: 0.7rem;
}
.wv-msg { max-width: 86%; padding: 0.7rem 0.9rem; border-radius: 14px;
  font-size: 0.88rem; line-height: 1.42; word-wrap: break-word; }
.wv-msg.user {
  align-self: flex-end; background: #0F766E; color: white;
  border-bottom-right-radius: 4px;
}
.wv-msg.bot {
  align-self: flex-start; background: white; color: #1F2937;
  border: 1px solid #E5E7EB; border-bottom-left-radius: 4px;
}
.wv-msg.bot.thinking { color: #6B7280; font-style: italic; }
.wv-msg.bot pre { background: #F5F5F4; padding: 0.5rem; border-radius: 6px;
  font-size: 0.76rem; overflow-x: auto; margin: 0.3rem 0; font-family: 'SF Mono', monospace; }

.wv-quick {
  padding: 0.5rem 1.1rem 0.75rem; display: flex; gap: 0.4rem;
  flex-wrap: wrap; background: #FAFAF9;
  border-top: 1px solid #F1F1F0;
}
.wv-quick-btn {
  font-size: 0.72rem; font-weight: 500; padding: 0.32rem 0.65rem;
  background: white; border: 1px solid #E5E7EB; border-radius: 8px;
  cursor: pointer; color: #4B5563; font-family: inherit;
  transition: all 0.18s; letter-spacing: -0.005em;
}
.wv-quick-btn:hover { background: #0F766E; color: white; border-color: #0F766E; }

.wv-input-bar {
  padding: 0.75rem 1rem 1rem; background: white;
  display: flex; gap: 0.5rem; align-items: flex-end;
  border-top: 1px solid #F1F1F0;
}
.wv-input {
  flex: 1; resize: none; border: 1px solid #E5E7EB; border-radius: 12px;
  padding: 0.6rem 0.8rem; font-size: 0.9rem; font-family: inherit;
  max-height: 100px; min-height: 40px; line-height: 1.4;
  transition: border-color 0.18s, box-shadow 0.18s; color: #1F2937;
}
.wv-input:focus { outline: none; border-color: #0F766E; box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.1); }
.wv-mic, .wv-send {
  width: 40px; height: 40px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; border: none; transition: all 0.2s; flex-shrink: 0;
}
.wv-mic { background: #F5F5F4; color: #4B5563; }
.wv-mic:hover { background: #EAEAE9; color: #1F2937; }
.wv-mic.listening {
  background: #B91C1C; color: white;
  animation: wvMicPulse 1.2s cubic-bezier(0.4,0,0.2,1) infinite;
}
.wv-send { background: #0F766E; color: white; }
.wv-send:hover { background: #0B5953; }
.wv-send:disabled { background: #D1D5DB; cursor: not-allowed; }

@keyframes wvMicPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(185, 28, 28, 0.5); }
  50% { box-shadow: 0 0 0 8px rgba(185, 28, 28, 0); }
}

@media (max-width: 600px) {
  .wv-bubble { width: 56px; height: 56px; bottom: 16px; right: 16px; }
  .wv-panel { right: 16px; bottom: 84px; width: calc(100vw - 32px); height: calc(100vh - 120px); }
}

@media (prefers-reduced-motion: reduce) {
  .wv-bubble::after, .wv-mic.listening { animation: none; }
}

/* D1493 contraste Weviavatar a la source : le CSS NUCLEAR global (background:#fff !important) ecrase le fond sombre du header => texte blanc invisible (blanc/blanc). On restaure le fond sombre de marque (white-on-dark = design voulu), !important pour battre le nuclear. WCAG-AA. Source unique = ce fichier, charge sur toutes les pages du widget (zero override par page = zero cumul). */
/* D1493b: nuclear gagne le BACKGROUND (#fff!important) -> on ne le combat pas. On force le TEXTE en sombre (lecon D1488 modal CRT) = texte sombre sur fond blanc, lisible WCAG-AA. */
.wv-head, .wv-head-info, .wv-head-title, .wv-head-sub, .wv-bubble, .wv-bubble-text, .wv-head-av, .wv-context-badge { color:#0f172a !important; }
