/* Les cartes de fiche (.coach-an*, .coach-gauge, .cag-*) sont parties dans
   styles/fiches.css : le tableau de bord gratuit s'en sert aussi. */
/* ============================================================
   COACH ZEE - Chat IA conversationnel
   Refonte UI/UX premium · Charte Zeepy stricte
   ============================================================ */

.coach-main {
  display: flex;
  flex-direction: column;
  /* dvh, pas vh : dans Safari onglet, 100vh compte la barre d'URL retractee,
     donc le bas du fil tombe hors ecran et devient inatteignable. */
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
}

.coach-layout {
  flex: 1;
  display: grid;
  grid-template-columns: 296px 1fr;
  gap: var(--space-4);
  padding: var(--space-4);
  min-height: 0;
  overflow: hidden;
}

/* ============================================================
   COLONNE GAUCHE
   ============================================================ */
.coach-sidebar {
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: var(--surface-1);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.coach-sidebar-top {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px 14px 12px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

.coach-new-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 11px 14px;
  border-radius: 11px;
  border: none;
  background: linear-gradient(135deg, #4997D0 0%, #7DD3FC 100%);
  color: #06121C;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.01em;
  cursor: pointer;
  box-shadow: 0 6px 22px rgba(73, 151, 208, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.4);
  transition: transform 0.18s ease, box-shadow 0.22s ease;
  position: relative;
  overflow: hidden;
}

.coach-new-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 30%, rgba(255, 255, 255, 0.3) 50%, transparent 70%);
  transform: translateX(-100%);
  transition: transform 0.6s ease;
}

.coach-new-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 32px rgba(73, 151, 208, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.coach-new-btn:hover::before {
  transform: translateX(100%);
}

.coach-search {
  position: relative;
  display: flex;
  align-items: center;
}

.coach-search svg {
  position: absolute;
  left: 11px;
  color: var(--text-muted);
  opacity: 0.6;
  pointer-events: none;
}

.coach-search input {
  width: 100%;
  padding: 9px 11px 9px 34px;
  border-radius: 9px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.025);
  color: var(--text);
  font-family: inherit;
  font-size: 12.5px;
  outline: none;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.coach-search input::placeholder { color: var(--text-muted); opacity: 0.65; }
.coach-search input:focus {
  border-color: rgba(73, 151, 208, 0.4);
  background: rgba(73, 151, 208, 0.06);
}

.coach-conv-list-body {
  flex: 1;
  overflow-y: auto;
  padding: 10px 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.coach-conv-list-body::-webkit-scrollbar { width: 5px; }
.coach-conv-list-body::-webkit-scrollbar-track { background: transparent; }
.coach-conv-list-body::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.08); border-radius: 4px; }
.coach-conv-list-body::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.16); }

.coach-conv-group-title {
  font-family: var(--font-mono);
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-muted);
  padding: 4px 8px 6px;
  opacity: 0.7;
}

.coach-conv-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 10px 10px 12px;
  border-radius: 10px;
  border: 1px solid transparent;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  color: inherit;
  position: relative;
  transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.coach-conv-item:hover {
  background: rgba(255, 255, 255, 0.035);
  border-color: rgba(255, 255, 255, 0.06);
  transform: translateX(2px);
}

.coach-conv-item.active {
  background: linear-gradient(135deg, rgba(73, 151, 208, 0.12) 0%, rgba(125, 211, 252, 0.06) 100%);
  border-color: rgba(73, 151, 208, 0.35);
  transform: none;
}

.coach-conv-item.active::before {
  content: '';
  position: absolute;
  left: 0;
  top: 18%;
  bottom: 18%;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(180deg, #4997D0, #7DD3FC);
  box-shadow: 0 0 12px rgba(125, 211, 252, 0.6);
}

.coach-conv-icon {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(73, 151, 208, 0.10);
  color: var(--accent-cool);
  margin-top: 1px;
}

.coach-conv-icon.kind-analyse { background: rgba(73, 151, 208, 0.12); color: var(--accent-cool); }
.coach-conv-icon.kind-ideas { background: rgba(251, 191, 36, 0.10); color: var(--warning); }
.coach-conv-icon.kind-compare { background: rgba(125, 211, 252, 0.10); color: var(--accent-cool); }
.coach-conv-icon.kind-audit { background: rgba(52, 211, 153, 0.10); color: var(--success); }
.coach-conv-icon.kind-strategy { background: rgba(125, 211, 252, 0.10); color: var(--accent-cool); }

.coach-conv-item-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.coach-conv-item-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.coach-conv-item-preview {
  font-size: 11.5px;
  color: var(--text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.35;
}

.coach-conv-item-time {
  font-size: 10px;
  color: var(--text-muted);
  opacity: 0.55;
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
  margin-top: 2px;
}

.coach-conv-item.active .coach-conv-item-title {
  background: linear-gradient(135deg, #7DD3FC 0%, #4997D0 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.coach-conv-unread {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--accent-cool);
  box-shadow: 0 0 10px #7DD3FC;
  flex-shrink: 0;
  margin-top: 11px;
  animation: coachPulse 2s ease-in-out infinite;
}

@keyframes coachPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.3); opacity: 0.7; }
}

.coach-sidebar-foot {
  padding: 12px 14px 14px;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
}

.coach-zeeps-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.coach-zeeps-card-head {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #FFC83D; /* doré (retour beta : voir l'avancée des Zeeps en or) */
}

.coach-zeeps-card-head svg { color: #FFC83D; }
.coach-zeeps-card-head .coach-zeeps-card-sub { color: var(--text-muted); }

.coach-zeeps-card-sub {
  font-weight: 500;
  color: var(--text-muted);
  font-size: 11px;
  margin-left: auto;
}

.coach-zeeps-bar {
  width: 100%;
  height: 4px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.05);
  overflow: hidden;
}

.coach-zeeps-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #E8A33D, #FFC83D);
  border-radius: 4px;
  box-shadow: 0 0 10px rgba(255, 200, 61, 0.6);
  transition: width 0.4s ease;
}

/* ============================================================
   COLONNE DROITE
   ============================================================ */
.coach-chat {
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: var(--surface-1);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  position: relative;
}

.coach-chat::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -20%;
  width: 700px;
  height: 700px;
  background: radial-gradient(circle, rgba(73, 151, 208, 0.10) 0%, transparent 65%);
  filter: blur(90px);
  pointer-events: none;
  z-index: 0;
  animation: coachAuroraDrift 18s ease-in-out infinite;
}

.coach-chat::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: -15%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(125, 211, 252, 0.08) 0%, transparent 60%);
  filter: blur(90px);
  pointer-events: none;
  z-index: 0;
  animation: coachAuroraDrift 22s ease-in-out infinite reverse;
}

@keyframes coachAuroraDrift {
  0%, 100% { transform: translate(0, 0); }
  50% { transform: translate(-30px, 20px); }
}

.coach-chat-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: 14px 22px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
  position: relative;
  z-index: 1;
  background: rgba(3, 7, 18, 0.45);
  backdrop-filter: blur(12px);
}

.coach-chat-header-left {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.coach-chat-avatar {
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: radial-gradient(circle at 30% 30%, rgba(125, 211, 252, 0.4), rgba(73, 151, 208, 0.15));
  border: 1px solid rgba(125, 211, 252, 0.35);
  box-shadow: 0 4px 16px rgba(73, 151, 208, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: visible;
}

.coach-chat-avatar img {
  width: 30px;
  height: 30px;
  object-fit: contain;
}

.coach-chat-avatar-dot {
  position: absolute;
  bottom: -2px;
  right: -2px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--success);
  border: 2px solid var(--surface-1);
  box-shadow: 0 0 8px rgba(52, 211, 153, 0.6);
}

.coach-chat-title {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0 0 2px;
  color: var(--text);
}

.coach-chat-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 11.5px;
  color: var(--text-muted);
}

.coach-chat-meta-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.coach-status-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 6px rgba(52, 211, 153, 0.7);
  animation: coachPulse 2.2s ease-in-out infinite;
}

.coach-chat-meta-sep {
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.4;
}

.coach-chat-actions {
  display: flex;
  gap: 4px;
}

.coach-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 9px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.02);
  color: var(--text-muted);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.coach-icon-btn:hover {
  background: rgba(73, 151, 208, 0.10);
  color: var(--text);
  border-color: rgba(73, 151, 208, 0.35);
  transform: translateY(-1px);
}

.coach-icon-btn.danger:hover {
  background: rgba(248, 113, 113, 0.10);
  color: var(--error);
  border-color: rgba(248, 113, 113, 0.35);
}

/* ============================================================
   BODY
   ============================================================ */
/* Bandeau disclaimer beta */
.coach-beta-note {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px 32px;
  background: rgba(73, 151, 208, 0.07);
  border-bottom: 1px solid rgba(73, 151, 208, 0.14);
  color: var(--text-muted, #8CA3BF);
  font-size: 12px;
  line-height: 1.45;
  flex-shrink: 0;
}
.coach-beta-note svg { color: var(--accent-cool); flex-shrink: 0; }
.coach-beta-note strong { color: #B9D9F2; font-weight: 700; }
@media (max-width: 760px) { .coach-beta-note { padding: 9px 16px; font-size: 11.5px; } }

.coach-chat-body {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden; /* Modifs 9 §6 : jamais de scroll horizontal dans la discussion */
  padding: 28px 32px;
  position: relative;
  z-index: 1;
  scroll-behavior: smooth;
}

.coach-chat-body::-webkit-scrollbar { width: 8px; }
.coach-chat-body::-webkit-scrollbar-track { background: transparent; }
.coach-chat-body::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.06); border-radius: 4px; }
.coach-chat-body::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.14); }

/* --- WELCOME --- */
.coach-welcome {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 760px;
  margin: 0 auto;
  padding: 28px 12px 24px;
  animation: coachWelcomeIn 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
}

@keyframes coachWelcomeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.coach-welcome-orbit {
  position: relative;
  width: 132px;
  height: 132px;
  margin-bottom: 24px;
}

.coach-welcome-orbit-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1px dashed rgba(73, 151, 208, 0.32);
  animation: coachOrbitSpin 16s linear infinite;
}

.coach-welcome-orbit-ring::after {
  content: '';
  position: absolute;
  top: -3.5px;
  left: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent-cool);
  box-shadow: 0 0 16px #7DD3FC, 0 0 28px rgba(125, 211, 252, 0.5);
  transform: translateX(-50%);
}

.coach-welcome-orbit-ring-2 {
  position: absolute;
  inset: -10px;
  border-radius: 50%;
  border: 1px dashed rgba(125, 211, 252, 0.18);
  animation: coachOrbitSpin 22s linear infinite reverse;
}

@keyframes coachOrbitSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.coach-welcome-mascot {
  position: absolute;
  inset: 14px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(73, 151, 208, 0.45) 0%, rgba(73, 151, 208, 0.05) 70%);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 0 22px rgba(125, 211, 252, 0.3);
  animation: coachMascotFloat 4s ease-in-out infinite;
}

@keyframes coachMascotFloat {
  0%, 100% {
    box-shadow: inset 0 0 22px rgba(125, 211, 252, 0.3);
    transform: translateY(0);
  }
  50% {
    box-shadow: inset 0 0 38px rgba(125, 211, 252, 0.55);
    transform: translateY(-4px);
  }
}

.coach-welcome-mascot img {
  width: 78px;
  height: 78px;
  object-fit: contain;
  filter: drop-shadow(0 6px 20px rgba(73, 151, 208, 0.4));
}

.coach-welcome-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(73, 151, 208, 0.15), rgba(125, 211, 252, 0.08));
  border: 1px solid rgba(73, 151, 208, 0.3);
  color: var(--accent-cool);
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 16px;
  box-shadow: 0 4px 16px rgba(73, 151, 208, 0.15);
}

.coach-welcome-tag::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent-cool);
  box-shadow: 0 0 6px #7DD3FC;
  animation: coachPulse 1.8s ease-in-out infinite;
}

.coach-welcome-title {
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.12;
  margin: 0 0 14px;
  color: var(--text);
}

.coach-welcome-title em {
  font-style: normal;
  background: linear-gradient(135deg, #4997D0 0%, #7DD3FC 50%, #7DD3FC 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: coachGradientShift 5s ease-in-out infinite;
}

@keyframes coachGradientShift {
  0%, 100% { background-position: 0% center; }
  50% { background-position: 100% center; }
}

.coach-welcome-sub {
  font-size: 15px;
  line-height: 1.55;
  color: var(--text-muted);
  max-width: 560px;
  margin: 0 0 32px;
}

.coach-welcome-pills {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  max-width: 700px;
  margin-bottom: 8px;
}

.coach-welcome-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.025);
  color: var(--text);
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.coach-welcome-pill:hover {
  transform: translateY(-2px);
  background: linear-gradient(135deg, rgba(73, 151, 208, 0.10), rgba(125, 211, 252, 0.04));
  border-color: rgba(73, 151, 208, 0.4);
  box-shadow: 0 6px 20px rgba(73, 151, 208, 0.15);
}

.coach-welcome-pill svg {
  color: var(--accent-cool);
}

/* Onboarding payant (LOT F3) : boutons de réponse dans le fil de conversation. */
.coach-onb-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin: 4px 0 14px 52px;
  animation: coach-onb-in 0.25s ease;
}
@keyframes coach-onb-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.coach-onb-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 11px 17px;
  border-radius: 999px;
  border: 1px solid rgba(73, 151, 208, 0.4);
  background: rgba(73, 151, 208, 0.08);
  color: var(--text);
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  transition: transform 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.coach-onb-btn:hover {
  transform: translateY(-2px);
  background: linear-gradient(135deg, rgba(73, 151, 208, 0.18), rgba(125, 211, 252, 0.08));
  box-shadow: 0 6px 18px rgba(73, 151, 208, 0.22);
}
.coach-onb-btn.ghost {
  border-color: var(--border);
  background: rgba(255, 255, 255, 0.03);
  color: var(--text-muted);
}
@media (max-width: 640px) { .coach-onb-btns { margin-left: 0; } }

.coach-welcome-divider {
  width: 60px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--border), transparent);
  margin: 28px auto 22px;
}

.coach-welcome-tip {
  font-size: 12px;
  color: var(--text-muted);
  opacity: 0.7;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.coach-welcome-tip svg { color: var(--warning); }

/* --- MESSAGES --- */
.coach-msg {
  display: flex;
  gap: 14px;
  margin: 0 auto 22px;
  max-width: 880px;
  animation: coachMsgIn 0.36s cubic-bezier(0.2, 0.8, 0.2, 1);
}

@keyframes coachMsgIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.coach-msg-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  margin-top: 2px;
}

.coach-msg.user .coach-msg-avatar {
  background: linear-gradient(135deg, #2E2E3A 0%, #1A1A24 100%);
  color: var(--text);
  border: 1px solid var(--border);
}

.coach-msg.zee .coach-msg-avatar {
  background: radial-gradient(circle at 30% 30%, rgba(125, 211, 252, 0.5), rgba(73, 151, 208, 0.15) 75%);
  border: 1px solid rgba(125, 211, 252, 0.4);
  box-shadow: 0 0 14px rgba(73, 151, 208, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.15);
  padding: 4px;
}

.coach-msg.zee .coach-msg-avatar img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.coach-msg-content {
  flex: 1;
  min-width: 0;
}

.coach-msg-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}

.coach-msg-author {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--text-muted);
}

.coach-msg.zee .coach-msg-author {
  color: var(--accent-cool);
}

.coach-msg-time {
  font-size: 10.5px;
  color: var(--text-muted);
  opacity: 0.55;
  font-variant-numeric: tabular-nums;
}

.coach-msg-bubble {
  font-size: 14px;
  line-height: 1.62;
  color: var(--text);
  overflow-wrap: break-word; /* Modifs 9 §6 : les longs mots/URLs ne débordent pas */
  word-break: break-word;
  min-width: 0;
}

.coach-msg-bubble p {
  margin: 0 0 10px;
}

.coach-msg-bubble p:last-child {
  margin-bottom: 0;
}

.coach-msg-bubble strong {
  color: var(--text);
  font-weight: 700;
}

.coach-msg-bubble em {
  font-style: normal;
  color: var(--accent-cool);
  font-weight: 600;
}

.coach-msg-bubble ul {
  margin: 6px 0 12px;
  padding-left: 0;
  list-style: none;
}

.coach-msg-bubble ul li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 8px;
  line-height: 1.55;
}

.coach-msg-bubble ul li::before {
  content: '';
  position: absolute;
  left: 4px;
  top: 9px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: linear-gradient(135deg, #4997D0, #7DD3FC);
  box-shadow: 0 0 6px rgba(125, 211, 252, 0.5);
}

.coach-msg.user .coach-msg-bubble {
  background: linear-gradient(135deg, rgba(73, 151, 208, 0.22), rgba(125, 211, 252, 0.12));
  border: 1px solid rgba(125, 211, 252, 0.35);
  border-radius: 14px;
  padding: 12px 16px;
}

/* Stat card inline */
.coach-msg-stat-card {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 14px 0;
  padding: 14px;
  border-radius: 12px;
  border: 1px solid rgba(73, 151, 208, 0.2);
  background: linear-gradient(135deg, rgba(73, 151, 208, 0.05), rgba(125, 211, 252, 0.02));
  position: relative;
  overflow: hidden;
}

.coach-msg-stat-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(125, 211, 252, 0.5), transparent);
}

.coach-stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.coach-stat-label {
  font-family: var(--font-mono);
  font-size: 9.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.coach-stat-value {
  font-size: 20px;
  font-weight: 800;
  color: var(--text);
  letter-spacing: -0.015em;
  line-height: 1.1;
}

.coach-stat-trend {
  font-size: 10.5px;
  font-weight: 600;
}

.coach-stat-trend.up { color: var(--success); }
.coach-stat-trend.down { color: var(--error); }

/* Hover actions sur message Zee */
.coach-msg-actions {
  display: flex;
  gap: 4px;
  margin-top: 10px;
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.coach-msg.zee:hover .coach-msg-actions {
  opacity: 1;
  transform: translateY(0);
}

.coach-msg-action {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 9px;
  border-radius: 7px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.02);
  color: var(--text-muted);
  font-family: inherit;
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.coach-msg-action:hover {
  background: rgba(73, 151, 208, 0.08);
  color: var(--text);
  border-color: rgba(73, 151, 208, 0.3);
}

.coach-msg-action.copied { color: var(--success); border-color: rgba(52, 211, 153, 0.35); }

/* Typing */
.coach-typing {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 0;
}

.coach-typing span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--accent-cool);
  box-shadow: 0 0 6px rgba(125, 211, 252, 0.5);
  animation: coachTyping 1.3s ease-in-out infinite;
}

.coach-typing span:nth-child(2) { animation-delay: 0.18s; }
.coach-typing span:nth-child(3) { animation-delay: 0.36s; }

@keyframes coachTyping {
  0%, 60%, 100% { opacity: 0.25; transform: translateY(0) scale(0.85); }
  30% { opacity: 1; transform: translateY(-3px) scale(1); }
}

/* ============================================================
   COMPOSER
   ============================================================ */
.coach-composer-wrap {
  flex-shrink: 0;
  padding: 14px 22px 18px;
  border-top: 1px solid var(--border);
  background: rgba(3, 7, 18, 0.55);
  backdrop-filter: blur(12px);
  position: relative;
  z-index: 1;
}

.coach-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 11px;
}

.coach-quick-action {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.025);
  color: var(--text);
  font-family: inherit;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: transform 0.15s ease, border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.coach-quick-action svg { color: var(--accent-cool); }

.coach-quick-action:hover {
  transform: translateY(-1px);
  background: rgba(73, 151, 208, 0.08);
  border-color: rgba(73, 151, 208, 0.4);
}

.coach-context-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.coach-context-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px 5px 12px;
  border-radius: 999px;
  background: rgba(73, 151, 208, 0.10);
  border: 1px solid rgba(73, 151, 208, 0.3);
  color: var(--accent-cool);
  font-size: 11.5px;
  font-weight: 500;
}

.coach-context-pill button {
  background: transparent;
  border: none;
  color: inherit;
  cursor: pointer;
  padding: 0;
  display: inline-flex;
  align-items: center;
  opacity: 0.6;
  transition: opacity 0.15s ease;
}
.coach-context-pill button:hover { opacity: 1; }

.coach-composer {
  position: relative;
}

.coach-composer-box {
  display: flex;
  flex-direction: column;
  padding: 12px 14px 10px;
  border-radius: 16px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.03);
  transition: border-color 0.22s ease, box-shadow 0.22s ease;
}

.coach-composer-box:focus-within {
  border-color: rgba(73, 151, 208, 0.55);
  box-shadow: 0 0 0 4px rgba(73, 151, 208, 0.12), 0 0 32px rgba(73, 151, 208, 0.2);
}

.coach-composer-input {
  width: 100%;
  resize: none;
  background: transparent;
  border: none;
  outline: none;
  color: var(--text);
  font-family: inherit;
  font-size: 14px;
  line-height: 1.55;
  padding: 2px 4px 4px;
  max-height: 180px;
  overflow-y: auto;
}

.coach-composer-input::placeholder {
  color: var(--text-muted);
  opacity: 0.65;
}

.coach-composer-input::-webkit-scrollbar { width: 4px; }
.coach-composer-input::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 4px; }

.coach-composer-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 6px;
}

.coach-composer-tools {
  display: flex;
  align-items: center;
  gap: 4px;
}

.coach-tool-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.coach-tool-btn:hover {
  background: rgba(73, 151, 208, 0.08);
  color: var(--accent-cool);
  border-color: rgba(73, 151, 208, 0.2);
}

.coach-composer-hint {
  font-size: 11px;
  color: var(--text-muted);
  opacity: 0.7;
  margin-left: 6px;
}

.coach-composer-hint kbd {
  display: inline-block;
  padding: 1px 5px;
  margin: 0 2px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid var(--border);
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text);
}

.coach-send-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  border: none;
  background: linear-gradient(135deg, #4997D0 0%, #7DD3FC 100%);
  color: #06121C;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(73, 151, 208, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.3);
  transition: transform 0.15s ease, box-shadow 0.2s ease, opacity 0.2s ease;
  flex-shrink: 0;
}

.coach-send-btn:hover {
  transform: translateY(-1px) scale(1.04);
  box-shadow: 0 8px 24px rgba(73, 151, 208, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.coach-send-btn:active {
  transform: translateY(0) scale(0.98);
}

.coach-send-btn:disabled {
  opacity: 0.3;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 980px) {
  /* LOT E (Modifs 4 §8) : la sidebar conversations est désormais un TIROIR
     (slide gauche), plus une barre repliée. L'ancien collapse horizontal +
     masquage recherche/liste est supprimé — la mise en forme du tiroir vit
     dans le bloc « COACH ZEE FAÇON CHATGPT » en fin de fichier. */
  .coach-welcome-title {
    font-size: 26px;
  }
}

@media (max-width: 640px) {
  .coach-chat-body { padding: 20px 16px; }
  .coach-composer-wrap { padding: 12px 14px 14px; }
  .coach-quick-actions { gap: 5px; }
  .coach-quick-action { font-size: 11px; padding: 5px 10px; }
  .coach-welcome-title { font-size: 22px; }
}

/* ============================================================
   CHARTE "vraie IA" (doc Modifs 2) — chat épuré façon Claude/ChatGPT.
   On hacke la perception : ça ressemble à un vrai assistant IA, pas
   à un chatbot SAV. Texte plein, sobre, l'user TAPE.
   ============================================================ */
/* Sobre : pas d'avatar à chaque message (l'avatar Zee reste dans le header du chat) */
.coach-msg-avatar { display: none; }
.coach-msg { gap: 0; }
/* Message user : boîte discrète (fond très léger, coins peu arrondis) -> pas façon Messenger */
.coach-msg.user .coach-msg-bubble {
  display: inline-block;
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
  border-radius: 12px;
  padding: 11px 15px;
}
body[data-theme="light"] .coach-msg.user .coach-msg-bubble { background: rgba(3, 7, 18, 0.04); }
/* Zee : texte plein, fond transparent (déjà le cas), juste un poil plus aéré */
.coach-msg.zee .coach-msg-bubble { font-size: 14.5px; }
/* Input épuré : zéro bouton de réponse rapide en IA libre -> l'user tape (signature
   du vrai assistant). Les suggestions de départ (welcome pills) restent, comme ChatGPT. */
.coach-quick-actions { display: none; }
/* Révélation progressive des blocs (animée en JS). Respecte reduce-motion. */
@media (prefers-reduced-motion: reduce) {
  .coach-msg-bubble > * { opacity: 1 !important; transform: none !important; }
}

/* ============================================================
   MODIFS 4 §8 — COACH ZEE FAÇON CHATGPT (LOT E)
   Barre du haut épurée · tiroir conversations · composer pill ·
   typo ChatGPT · nudge cyan · conversation plein écran.
   Bloc en fin de fichier : gagne sur les règles précédentes.
   ============================================================ */

/* --- Barre du haut : ☰ conversations + logo Zeepy (rien à droite) --- */
.coach-topbar {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  align-items: center;
  gap: 8px;
  /* Safe-area en haut : sur PWA iOS (status bar translucide) la head passait sous
     l'encoche et le ☰ n'était plus tappable (Modifs 5 §6.A). */
  padding: calc(8px + env(safe-area-inset-top)) 12px 8px;
  min-height: 0;
  height: auto;
  border-bottom: 1px solid var(--border);
  background: transparent;
  flex: 0 0 auto;
}
/* Cloche + photo à droite de la barre Zee (Modifs 6 §3). */
.coach-topbar-end { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.coach-menu-btn {
  width: 42px; height: 42px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.02);
  color: var(--text);
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, transform .12s ease;
  -webkit-tap-highlight-color: transparent;
}
.coach-menu-btn:hover { background: rgba(73, 151, 208, 0.10); border-color: rgba(73, 151, 208, 0.35); }
.coach-menu-btn:active { transform: scale(.92); }
.coach-menu-btn svg { width: 21px; height: 21px; }
.coach-brand {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  font-weight: 800; font-size: 18px; letter-spacing: .2px;
  color: var(--text); text-decoration: none;
}
.coach-brand img { display: block; }
.coach-brand b {
  background: linear-gradient(90deg, #EDF1F7, #bfe6fb);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
/* Modifs 9 §6 : la photo de profil doit être À CÔTÉ de la cloche (comme
   l'Accueil), pas dessous. display:block empilait cloche + photo verticalement. */
.coach-topbar-end { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }

/* --- Layout : une seule colonne, le chat prend tout --- */
.coach-layout {
  display: block;
  grid-template-columns: none;
  gap: 0;
  padding: 0;
  position: relative;
}

/* --- Tiroir conversations (slide gauche, overlay toutes tailles) --- */
/* Ceinture ET bretelles : `hidden` suffit tant que personne n'oublie de le
   reposer, mais un voile invisible qui avale les clics est indiagnosticable
   depuis un telephone. Tant que le tiroir n'est pas ouvert, il laisse
   passer. */
.coach-drawer-backdrop { pointer-events: none; }
.coach-drawer-backdrop.open { pointer-events: auto; }
.coach-drawer-backdrop {
  position: fixed; inset: 0; z-index: 1199;
  background: rgba(0, 0, 0, .55);
  opacity: 0; transition: opacity .25s ease;
}
.coach-drawer-backdrop.open { opacity: 1; }
.coach-sidebar {
  position: fixed; top: 0; left: 0; bottom: 0; z-index: 1200;
  display: flex; flex-direction: column; align-items: stretch;
  width: min(80%, 340px); /* Modifs 10 : tiroir conv à 80% (moins envahissant) */
  margin: 0; overflow: hidden;
  border: 0; border-right: 1px solid var(--border); border-radius: 0;
  background: var(--surface-1);
  transform: translateX(-104%);
  transition: transform .3s cubic-bezier(.22, 1, .36, 1);
  padding-top: env(safe-area-inset-top);
}
.coach-sidebar .coach-sidebar-top { display: flex; }
.coach-sidebar .coach-conv-list-body { display: block; }
/* Le tiroir reste dédié aux conversations : pas de widget « prochaine étape »
   (injecté par sidebar-accordion.js en fallback sur .coach-sidebar). */
.coach-sidebar .next-step { display: none; }
.coach-sidebar.open { transform: none; }
.coach-drawer-title {
  padding: 4px 16px 8px;
  font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-muted);
}
.coach-conv-list-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.coach-sidebar-foot {
  padding: 12px 14px calc(14px + env(safe-area-inset-bottom));
  border-top: 1px solid var(--border);
}
.coach-new-btn {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  width: 100%; padding: 13px;
  border: 0; border-radius: 14px; cursor: pointer;
  background: linear-gradient(150deg, #7ad2f6, #3a9fd6);
  color: #06222f; font-family: inherit; font-weight: 800; font-size: 15px;
  box-shadow: 0 6px 18px rgba(73, 151, 208, .3);
  transition: transform .12s ease;
}
.coach-new-btn:active { transform: scale(.98); }

/* --- Colonne chat : plein écran --- */
.coach-chat {
  display: flex; flex-direction: column;
  min-height: 0; height: 100%;
  border: 0; border-radius: 0; background: transparent;
}

/* --- Barre de Zeeps, version fine --- */
.coach-chat > .coach-zeeps-card {
  flex: 0 0 auto;
  margin: 0 12px 6px;
  padding: 8px 13px;
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(245, 194, 75, .05), rgba(245, 194, 75, .02));
  border: 1px solid rgba(245, 194, 75, .16);
}
.coach-chat > .coach-zeeps-card .coach-zeeps-card-head {
  display: flex; align-items: center; gap: 7px; margin-bottom: 6px;
  color: #F5C24B; font-weight: 800; font-size: 14px;
}
.coach-chat > .coach-zeeps-card .coach-zeeps-card-sub { color: var(--text-muted); font-weight: 600; font-size: 12.5px; }
.coach-chat > .coach-zeeps-card .coach-zeeps-bar { height: 6px; border-radius: 5px; background: #2A2412; overflow: hidden; }
.coach-chat > .coach-zeeps-card .coach-zeeps-bar-fill { height: 100%; border-radius: 5px; background: linear-gradient(90deg, #F5C24B, #ffd874); }

.coach-visually-hidden {
  position: absolute !important; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* --- Corps de conversation : centré, généreux (façon ChatGPT) --- */
.coach-chat-body {
  flex: 1 1 auto; min-height: 0; overflow-y: auto;
  padding: 8px 16px 16px;
}
.coach-chat-body > * { max-width: 720px; margin-left: auto; margin-right: auto; }

/* Bandeau bêta : compact, scrolle avec le contenu */
.coach-beta-note {
  display: flex; gap: 11px; align-items: flex-start;
  padding: 11px 13px; border-radius: 13px; margin: 4px auto 16px;
  background: linear-gradient(180deg, rgba(45, 137, 200, .10), rgba(45, 137, 200, .04));
  border: 1px solid rgba(73, 151, 208, .18);
  position: static;
}
.coach-beta-note svg { flex: 0 0 auto; color: #7DD3FC; margin-top: 1px; }
.coach-beta-note span { font-size: 13px; line-height: 1.5; color: #C4D0DD; }
.coach-beta-note strong { color: var(--text); }

/* --- Messages façon ChatGPT --- */
.coach-msg { display: block; margin-bottom: 18px; gap: 0; }
.coach-msg .coach-msg-avatar,
.coach-msg .coach-msg-header { display: none; }
.coach-msg .coach-msg-content { max-width: none; width: auto; }

/* User : bulle à droite */
.coach-msg.user { display: flex; justify-content: flex-end; }
.coach-msg.user .coach-msg-content { max-width: 84%; }
.coach-msg.user .coach-msg-bubble {
  background: var(--surface-2, #131C29);
  border: 1px solid var(--border);
  padding: 12px 16px; border-radius: 20px 20px 6px 20px;
  font-size: 15.5px; line-height: 1.5; color: #E6ECF4;
}

/* Zee : texte qui coule, pas de bulle */
.coach-msg.zee .coach-msg-bubble {
  background: transparent; border: 0; padding: 0;
  font-size: 16px; line-height: 1.62; color: var(--text);
}
.coach-msg.zee .coach-msg-bubble p { margin: 0 0 14px; }
.coach-msg.zee .coach-msg-bubble ul { margin: 0 0 14px; padding-left: 20px; }
.coach-msg.zee .coach-msg-bubble li { margin-bottom: 7px; line-height: 1.55; }
.coach-msg.zee .coach-msg-bubble strong { color: #fff; font-weight: 700; }
.coach-msg.zee .coach-msg-bubble em { color: var(--text-muted); font-style: italic; }

/* Actions (copier / régénérer / sauvegarder) : discrètes sous la réponse */
.coach-msg.zee .coach-msg-actions { display: flex; gap: 6px; margin-top: 8px; opacity: .8; }

/* --- Nudge (relance de Zee) : question en cyan + gras --- */
.coach-nudge {
  display: flex; gap: 10px; align-items: flex-start;
  margin: 6px 0 4px; padding: 13px 15px; border-radius: 14px;
  background: linear-gradient(180deg, rgba(73, 151, 208, .10), rgba(73, 151, 208, .03));
  border: 1px solid rgba(73, 151, 208, .28);
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: border-color .15s ease, background .15s ease, transform .12s ease;
}
.coach-nudge:hover { border-color: rgba(125, 211, 252, .55); background: linear-gradient(180deg, rgba(73, 151, 208, .16), rgba(73, 151, 208, .05)); }
.coach-nudge:active { transform: scale(.99); }
.coach-nudge-ico { font-size: 17px; line-height: 1.3; }
.coach-nudge-q {
  font-weight: 800; font-size: 15.5px; line-height: 1.45;
  color: #8FDDFF; text-shadow: 0 0 18px rgba(73, 151, 208, .35);
}
/* Relance de navigation (fin d'analyse) : flèche pour montrer qu'elle emmène
   vers l'onglet Vidéos. */
.coach-nudge-nav { justify-content: space-between; }
.coach-nudge-nav::after {
  content: "\2192"; margin-left: auto; color: #8FDDFF; font-size: 18px; font-weight: 800; flex: none;
}

/* --- ANALYSE VIDÉO : mini-cards par catégorie --- */
/* Halo d'accent doux en haut à gauche (touche premium, comme les glass cards). */
/* Section chiffres : chips */
/* Accents par catégorie */

/* Jauge « croissance » (section Estimations potentielles) — pleine + lumineuse. */
/* Deux gros chiffres : aujourd'hui -> potentiel (le potentiel brille). */
/* Barre pleine, épaisse, avec point « tu es ici » + cible pulsante. */
@keyframes cag-pulse {
  0%,100% { box-shadow: 0 0 0 4px rgba(125,211,252,.2), 0 0 12px rgba(125,211,252,.55); }
  50%     { box-shadow: 0 0 0 7px rgba(125,211,252,.09), 0 0 22px rgba(125,211,252,.9); }
}

/* --- Message éphémère du « + » --- */
.coach-soon {
  display: flex; align-items: center; gap: 9px; justify-content: center;
  width: fit-content; margin: 4px auto; padding: 10px 15px; border-radius: 14px;
  background: linear-gradient(180deg, rgba(73, 151, 208, .12), rgba(73, 151, 208, .04));
  border: 1px solid rgba(73, 151, 208, .3);
  color: #cdeafb; font-size: 13.5px; font-weight: 600;
  opacity: 0; transform: translateY(6px); transition: opacity .25s ease, transform .25s ease;
}
.coach-soon.in { opacity: 1; transform: none; }
.coach-soon-em { font-size: 15px; }

/* --- Composer façon ChatGPT : « + » + champ + envoyer --- */
.coach-composer-wrap { flex: 0 0 auto; padding: 6px 12px 10px; }
.coach-composer { max-width: 720px; margin: 0 auto; }
.coach-composer-box.coach-composer-pill {
  display: flex; flex-direction: row; align-items: flex-end; gap: 8px;
  background: var(--surface-2, #131C29);
  border: 1px solid var(--border);
  border-radius: 26px; padding: 7px 8px;
}
.coach-plus-btn {
  flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%;
  border: 0; background: rgba(255, 255, 255, .06); color: var(--text);
  display: grid; place-items: center; cursor: pointer; transition: transform .12s ease, background .18s ease;
}
.coach-plus-btn svg { width: 20px; height: 20px; }
.coach-plus-btn:hover { background: rgba(73, 151, 208, .14); }
.coach-plus-btn:active { transform: scale(.9); }
.coach-composer-box.coach-composer-pill .coach-composer-input {
  flex: 1 1 auto; align-self: center;
  background: transparent; border: 0; outline: 0; resize: none;
  color: var(--text); font-family: inherit; font-size: 16px; line-height: 1.35;
  max-height: 132px; padding: 6px 2px; min-height: 22px; height: 34px;
  overflow-y: auto;
}
/* Empty state (nouvelle conversation) : pas de scroll, contenu centré (mockup). */
/* Centrage SANS piege. `justify-content: center` centre bien un ecran court,
   mais des que le contenu depasse il le rogne EN HAUT ET EN BAS et le
   defilement ne peut plus l'atteindre : c'est ce qui rendait « Ma strategie »
   inutilisable. Un `margin-block: auto` sur l'enfant centre quand il y a la
   place, et se replie a zero quand il n'y en a plus. */
.coach-chat-body:has(> .coach-welcome) { overflow-y: auto; display: flex; flex-direction: column; }
.coach-chat-body > .coach-welcome { margin-block: auto; }
.coach-composer-box.coach-composer-pill .coach-send-btn {
  flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%;
  border: 0; cursor: pointer; display: grid; place-items: center;
  background: linear-gradient(150deg, #7ad2f6, #3a9fd6);
  box-shadow: 0 4px 14px rgba(73, 151, 208, .35); transition: transform .12s ease, opacity .18s ease;
}
.coach-composer-box.coach-composer-pill .coach-send-btn svg { width: 20px; height: 20px; }
.coach-composer-box.coach-composer-pill .coach-send-btn:active { transform: scale(.9); }
.coach-composer-box.coach-composer-pill .coach-send-btn:disabled { opacity: .4; box-shadow: none; cursor: default; }

/* Le tiroir conversations flotte au-dessus de tout, y compris la nav du bas */
body.coach-drawer-open { overflow: hidden; }

/* ===== Gap clavier (web app Safari) — Modifs 6 §3 ===============================
   Au focus du composer : on cache la nav du bas (et la bulle Zee), et le composer
   est ancré au sommet du clavier via window.visualViewport (translateY posé en JS).
   Sinon un gros vide reste entre le texte et le clavier. */
body.coach-kb-focus .m-tabbar { display: none !important; }
body.coach-kb-focus .zee-bubble-wrap { display: none !important; }
body.coach-kb-focus .coach-composer-wrap {
  padding-bottom: 8px !important;
  transition: transform .16s cubic-bezier(.22,1,.36,1);
  will-change: transform;
}

/* Modifs 10 §Zee : menu par conversation (renommer / supprimer) */
.coach-conv-item { position: relative; }
.coach-conv-more { margin-left: auto; flex: none; width: 28px; height: 28px; border: 0; background: transparent; color: var(--text-muted); font-size: 19px; line-height: 1; border-radius: 8px; cursor: pointer; opacity: .5; transition: opacity .15s, background .15s; }
.coach-conv-more:hover, .coach-conv-item:hover .coach-conv-more { opacity: 1; }
.coach-conv-more:hover { background: rgba(255,255,255,.07); }
.coach-conv-menu { position: fixed; z-index: 1400; min-width: 168px; background: var(--surface-1, #0e1626); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 14px 34px rgba(0,0,0,.5); padding: 6px; display: flex; flex-direction: column; }
.coach-conv-menu button { display: flex; align-items: center; gap: 9px; width: 100%; padding: 11px 12px; border: 0; background: transparent; color: var(--text); font: inherit; font-size: 14px; font-weight: 600; text-align: left; border-radius: 9px; cursor: pointer; }
.coach-conv-menu button:hover { background: rgba(73,151,208,.15); }
.coach-conv-menu button.danger { color: #ff6b70; }

/* Funnel Freemium : CTA de close (Zeeps cramés) dans le fil Zee -> tarifs */
.coach-upsell { display: block; max-width: 340px; margin: 16px auto 8px; text-align: center; text-decoration: none; background: linear-gradient(180deg, #8fd4f5, #4997D0); color: #062333; font-weight: 800; font-size: 15.5px; border-radius: 24px; padding: 15px 18px; box-shadow: 0 10px 26px rgba(73,151,208,.4); }
.coach-upsell:hover { transform: translateY(-1px); }

/* ============ HUB CATÉGORIES (landing du coach) ============ */
.coach-cats { display: flex; flex-direction: column; gap: 11px; width: 100%; max-width: 480px; margin: 26px auto 0; }
/* Hub des catégories en glass-panel (design system §22) : les 2 cartes flottent
   dans un panneau verre dépoli avec halo bleu. Padding pour ne pas être au ras. */
.coach-cats-glass { padding: 16px; }
.coach-cat { display: flex; align-items: center; gap: 14px; width: 100%; text-align: left; cursor: pointer; font-family: inherit;
  background: var(--surface-2, rgba(255,255,255,.03)); border: 1px solid var(--border-default, rgba(73,151,208,.18));
  border-radius: 16px; padding: 15px 16px; transition: .16s; }
.coach-cat:hover { border-color: rgba(73,151,208,.5); background: rgba(73,151,208,.06); transform: translateY(-1px); }
.coach-cat:active { transform: scale(.99); }
.coach-cat-ic { width: 42px; height: 42px; flex: none; display: flex; align-items: center; justify-content: center; font-size: 21px;
  border-radius: 12px; background: rgba(73,151,208,.14); border: 1px solid rgba(73,151,208,.22); }
.coach-cat-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.coach-cat-tx b { font-size: 15.5px; font-weight: 700; color: var(--text-primary, #eaf2fb); }
.coach-cat-tx span { font-size: 12.5px; color: var(--text-muted); line-height: 1.3; }
.coach-cat-go { flex: none; color: #7DD3FC; font-size: 20px; font-weight: 800; opacity: .7; }
.coach-cat:hover .coach-cat-go { opacity: 1; transform: translateX(2px); }

/* Items catégorie dans la sidebar */
.coach-cat-emoji { font-size: 17px; display: flex; align-items: center; justify-content: center; }
.coach-conv-item-prev { display: block; font-size: 11px; color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 1px; }
.coach-cat-go2 { flex: none; color: var(--text-muted); font-size: 16px; font-weight: 800; padding: 0 4px; }
.coach-cat-item.active { background: rgba(73,151,208,.14); }

/* ============ COACH 100% CONTRÔLÉ ============
   Pas de saisie libre : le composer reste dans le DOM (deep-link d'analyse via
   startFromPrompt) mais n'est jamais visible. Chaque action est cadrée. */
.coach-composer-wrap { display: none !important; }
.coach-chat-body { padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }

/* ============ ÉCRAN « MA STRATÉGIE » (récap onboarding payant) ============ */
.coach-strat { width: 100%; max-width: 480px; margin: 22px auto 0; }
.coach-strat-load { text-align: center; color: var(--text-muted); font-size: 13.5px; padding: 20px; }
.coach-strat-list { display: flex; flex-direction: column; gap: 9px; }
.coach-strat-row { display: flex; align-items: flex-start; gap: 12px; text-align: left;
  background: var(--surface-2, rgba(255,255,255,.03)); border: 1px solid var(--border-default, rgba(73,151,208,.18));
  border-radius: 14px; padding: 13px 15px; }
.coach-strat-ic { flex: none; width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; font-size: 17px;
  border-radius: 10px; background: rgba(73,151,208,.14); border: 1px solid rgba(73,151,208,.22); }
.coach-strat-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.coach-strat-tx b { font-size: 12px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: var(--text-muted); }
.coach-strat-tx span { font-size: 14.5px; font-weight: 600; color: var(--text-primary, #eaf2fb); line-height: 1.35; }
.coach-strat-cta-wrap { margin-top: 20px; display: flex; flex-direction: column; gap: 10px; }
/* Le bilan passe devant le plan : savoir ou on en est precede de decider
   quoi faire. Le second bouton reste lisible mais ne rivalise pas. */
.coach-strat-bilan { width: 100%; border: 0; cursor: pointer; font-family: inherit; }
.coach-strat-cta-2 { background: rgba(255,255,255,.05); color: var(--text-secondary, #9DB2CA); }
.coach-strat-cta { display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; text-decoration: none;
  background: linear-gradient(180deg, #8fd4f5, #4997D0); color: #062333; font-weight: 800; font-size: 16px;
  border-radius: 20px; padding: 16px 18px; box-shadow: 0 12px 28px rgba(73,151,208,.4); transition: transform .16s; }
.coach-strat-cta span { font-size: 12.5px; font-weight: 600; opacity: .8; }
.coach-strat-cta:hover { transform: translateY(-1px); }

/* --- BILAN : bouton de mise a jour sous les cartes ---------------------- */
/* Meme habillage que la relance de fin d'analyse (cyan), avec la fleche qui
   annonce qu'on change d'ecran. */
.coach-maj-strat { justify-content: space-between; }
.coach-maj-strat::after {
  content: "\2192"; margin-left: auto; color: #8FDDFF; font-size: 18px; font-weight: 800; flex: none;
}
.coach-maj-strat:focus-visible { outline: 2px solid #8FDDFF; outline-offset: 2px; }

/* Le 3e bouton du recap est une action secondaire : visible, jamais en
   concurrence avec le bilan qui reste l'entree principale. */
.coach-strat-cta-3 {
  background: rgba(73,151,208,.10); border: 1px solid rgba(73,151,208,.30);
  color: #8FDDFF; box-shadow: none; cursor: pointer; font-family: inherit; width: 100%;
}
.coach-strat-cta-3:hover { background: rgba(73,151,208,.16); }

/* --- QUESTIONNAIRE STRATEGIE ------------------------------------------- */
.coach-welcome-form { text-align: left; }
.coach-welcome-form .coach-welcome-tag,
.coach-welcome-form .coach-welcome-title,
.coach-welcome-form .coach-welcome-sub { text-align: center; }
.coach-sform { display: flex; flex-direction: column; gap: 12px; margin-top: 22px; }
.coach-sq {
  background: var(--surface-2, rgba(255,255,255,.03));
  border: 1px solid var(--border-default, rgba(73,151,208,.18));
  border-radius: 16px; padding: 14px 15px;
}
.coach-sq-h {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 14.5px; font-weight: 700; color: var(--text-primary, #eaf2fb); margin-bottom: 11px;
}
.coach-sq-h span { font-size: 16px; }
.coach-sq-h em {
  font-style: normal; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: #8FDDFF; background: rgba(73,151,208,.14); border-radius: 999px; padding: 3px 8px;
}
.coach-sq-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.coach-sq-chip {
  font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer;
  color: var(--text-secondary, #9DB2CA); background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10); border-radius: 999px; padding: 9px 14px;
  transition: background .14s ease, border-color .14s ease, color .14s ease;
  -webkit-tap-highlight-color: transparent;
}
.coach-sq-chip:hover { border-color: rgba(73,151,208,.40); color: var(--text-primary, #eaf2fb); }
.coach-sq-chip.on {
  background: rgba(73,151,208,.18); border-color: rgba(143,221,255,.55); color: #8FDDFF;
  box-shadow: 0 0 0 1px rgba(143,221,255,.18) inset;
}
.coach-sq-chip:focus-visible { outline: 2px solid #8FDDFF; outline-offset: 2px; }
.coach-sq-ta {
  width: 100%; font: inherit; font-size: 14.5px; line-height: 1.5; resize: vertical;
  color: var(--text-primary, #eaf2fb); background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10); border-radius: 12px; padding: 11px 13px;
}
.coach-sq-ta::placeholder { color: var(--text-muted, #6D8299); }
.coach-sq-ta:focus { outline: none; border-color: rgba(143,221,255,.55); background: rgba(73,151,208,.08); }
.coach-sform-foot { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.coach-sform-foot .coach-strat-cta { border: 0; cursor: pointer; font-family: inherit; width: 100%; }
.coach-sform-foot .coach-strat-cta:disabled { opacity: .6; cursor: default; transform: none; }
.coach-sform-back {
  font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; padding: 10px;
  color: var(--text-muted, #6D8299); background: none; border: 0;
}
.coach-sform-back:hover { color: var(--text-secondary, #9DB2CA); }