/* ══════════════════════════════════════════════════
   PAGE ANALYSE — STYLES SPÉCIFIQUES
   ══════════════════════════════════════════════════ */

/* ── Layout ──────────────────────────────────────────── */
.analyse-layout {
  display:flex; flex-direction:column;
  height:calc(100vh - 76px); overflow:hidden;
}

/* ── Hero ────────────────────────────────────────────── */
.a-hero {
  background: linear-gradient(135deg, #0F3D4A 0%, #0E5548 60%, #14724E 100%);
  padding: 13px 28px;
  display:flex; align-items:center; justify-content:space-between;
  flex-shrink:0; gap:20px; border-bottom:1px solid rgba(0,0,0,.15);
}
.a-hero-left { display:flex; align-items:center; gap:14px; }
.a-hero-icon { font-size:26px; }
.a-hero-eyebrow { font-size:9.5px; font-weight:700; text-transform:uppercase;
  letter-spacing:1.2px; color:rgba(255,255,255,.45); margin-bottom:3px; }
.a-hero-title { font-size:19px; font-weight:800; color:white; letter-spacing:-0.3px; line-height:1.1; }
.a-hero-sub { font-size:11px; color:rgba(255,255,255,.55); margin-top:3px; }
.a-hero-right { display:flex; align-items:center; gap:12px; }

/* ── FAB scroll top ──────────────────────────────────── */
.scroll-top-fab {
  position:fixed; bottom:108px; right:22px; z-index:50;
  width:36px; height:36px; border-radius:50%;
  background:var(--navy); color:white; border:none;
  cursor:pointer; font-size:14px;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 3px 10px rgba(0,0,0,.25); transition:all .15s; opacity:.7;
}
.scroll-top-fab:hover { opacity:1; transform:translateY(-2px); }

/* ── Boutons hero ────────────────────────────────────── */
.btn-hero {
  padding:5px 13px; border-radius:8px;
  border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.1); color:rgba(255,255,255,.85); font-size:12px;
  cursor:pointer; transition:all .15s; white-space:nowrap;
}
.btn-hero:hover { background:rgba(255,255,255,.2); color:white; }
.hero-counter { font-size:11px; color:rgba(255,255,255,.45); white-space:nowrap; }

/* ── Zone messages ───────────────────────────────────── */
.messages-area {
  flex:1; overflow-y:auto; padding:24px 28px;
  display:flex; flex-direction:column; gap:26px; scroll-behavior:smooth;
}

/* ── Chat turns ──────────────────────────────────────── */
.chat-turn { display:flex; flex-direction:column; gap:6px; }
.chat-turn--user { align-items:flex-end; }
.chat-turn--ai   { align-items:flex-start; width:100%; }
.chat-meta { display:flex; align-items:center; gap:8px; padding:0 4px; }
.chat-meta--user { flex-direction:row-reverse; }
.chat-avatar { font-size:15px; }
.chat-sender { font-size:11px; font-weight:700;
  letter-spacing:.3px; color:var(--slate);
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif; }
.chat-sender--ai { color:var(--blue-dark); }
.chat-time { font-size:10px; color:#94A3B8; }
.chat-divider { flex:1; height:1px; background:var(--border); }

/* ── Bulle utilisateur ───────────────────────────────── */
.msg-user {
  max-width:640px;
  background: linear-gradient(135deg, #2563EB 0%, #1E40AF 100%);
  color:white; padding:13px 19px;
  border-radius:20px 20px 4px 20px;
  font-size:14px; line-height:1.55;
  box-shadow:0 2px 10px rgba(37,99,235,.35);
}

/* ── Bloc assistant ──────────────────────────────────── */
.msg-assistant { align-self:flex-start; width:100%; max-width:960px; }

/* ── Stepper ─────────────────────────────────────────── */
.stepper {
  background:var(--white); border:1px solid var(--border);
  border-radius:var(--radius) var(--radius) 0 0;
  border-left:3px solid #0E5548;
  padding:10px 16px; display:flex; flex-direction:column; gap:4px;
}
.step-row { display:flex; align-items:center; gap:9px; font-size:12.5px; min-height:22px; }
.step-icon {
  width:18px; height:18px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:9px;
}
.step-icon.waiting { background:var(--slate-light); border:1.5px solid var(--border); }
.step-icon.running {
  background:var(--amber-light); border:1.5px solid var(--amber);
  animation:pulse-ring 1.2s ease-in-out infinite;
}
.step-icon.done { background:var(--green-light); border:1.5px solid var(--green); }
@keyframes pulse-ring {
  0%,100% { box-shadow:0 0 0 0 rgba(245,158,11,.4); }
  50%      { box-shadow:0 0 0 4px rgba(245,158,11,0); }
}
.step-label { flex:1; color:var(--navy); }
.step-label.running { font-weight:600; color:var(--blue-dark); }
.step-label.waiting { color:#94A3B8; }
.step-label--sql { cursor:pointer; user-select:none; }
.step-label--sql:hover { color:var(--blue); }
.step-sql-toggle { font-size:10px; color:var(--blue); margin-left:4px; font-weight:700; }
.step-timer { font-size:11px; color:var(--amber); font-weight:600; font-variant-numeric:tabular-nums; }
.step-done-time { font-size:11px; color:var(--slate); font-variant-numeric:tabular-nums; }
.step-total {
  display:flex; align-items:center; justify-content:space-between; gap:6px;
  font-size:11px; font-weight:600; color:var(--navy);
  padding-top:5px; border-top:1px dashed var(--border); margin-top:2px;
  font-variant-numeric:tabular-nums;
}
.step-total-label { color:var(--slate); font-weight:400; }
.step-total-time  { display:flex; align-items:center; gap:6px; }
.step-cost { font-size:10.5px; color:var(--slate); font-weight:400;
  background:var(--slate-light); border-radius:5px; padding:2px 7px; }

/* ── Stepper archivé réduit ──────────────────────────── */
.step-summary {
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:4px 0; cursor:pointer; user-select:none;
}
.step-summary:hover .step-toggle-btn { color:var(--blue); }
.step-toggle-btn { font-size:10px; color:var(--slate); font-weight:600; white-space:nowrap; flex-shrink:0; }
.step-summary-left { display:flex; align-items:center; gap:8px; font-size:11px; font-weight:600; color:var(--navy); font-variant-numeric:tabular-nums; }
.step-detail { border-top:1px dashed var(--border); margin-top:5px; padding-top:5px; }

/* ── Ishikawa ─────────────────────────────────────────── */
.ishikawa-wrap { margin:4px 0 8px; }
.ishikawa-title { font-size:15px; font-weight:700; margin:12px 0 6px; color:var(--navy);
  padding-bottom:4px; border-bottom:2px solid var(--border); display:flex; align-items:center; gap:6px; }
.ishikawa-svg-container { width:100%; overflow:visible; }

/* ── SQL Detail ──────────────────────────────────────── */
.sql-detail {
  background:#0D1B2A; border-radius:6px;
  margin:3px 0 3px 27px; padding:9px 13px;
  overflow-x:auto; border-left:2px solid #2563EB;
}
.sql-num { font-size:9px; font-weight:700; text-transform:uppercase;
  letter-spacing:.7px; color:#5BA4CF; margin-bottom:4px; }
.sql-code { font-family:'Menlo','Monaco','Consolas',monospace;
  font-size:10.5px; color:#A8D8B9; line-height:1.7;
  white-space:pre-wrap; word-break:break-all; }
.sql-sep { border:none; border-top:1px solid #1E3348; margin:7px 0; }

/* ── Dots animation ──────────────────────────────────── */
.dots { display:inline-flex; gap:3px; align-items:center; }
.dots span {
  width:4px; height:4px; border-radius:50%; background:var(--amber);
  animation:bounce-dot 1.2s ease-in-out infinite;
}
.dots span:nth-child(2) { animation-delay:.2s; }
.dots span:nth-child(3) { animation-delay:.4s; }
@keyframes bounce-dot {
  0%,80%,100% { transform:scale(.6); opacity:.4; }
  40%          { transform:scale(1);  opacity:1; }
}

/* ── Bulle réponse ───────────────────────────────────── */
.response-bubble {
  background:var(--white); border:1px solid var(--border); border-top:none;
  border-radius:0 0 var(--radius) var(--radius);
  padding:16px 22px; display:flex; flex-direction:column; gap:10px;
}

/* ── TOC ─────────────────────────────────────────────── */
.toc-box {
  background:var(--slate-light); border-radius:10px;
  padding:10px 14px; display:flex; flex-direction:column; gap:5px;
}
.toc-label { font-size:10px; font-weight:800; text-transform:uppercase;
  letter-spacing:.6px; color:var(--slate); margin-bottom:2px; }
.toc-link {
  display:flex; align-items:center; gap:8px; padding:5px 8px;
  border-radius:6px; font-size:13px; color:var(--navy);
  cursor:pointer; transition:all .12s; user-select:none;
}
.toc-link:hover { background:var(--white); color:var(--blue); }
.toc-link.primary   { border-left:3px solid var(--red); }
.toc-link.secondary { border-left:3px solid var(--amber); }
.toc-link.constat   { border-left:3px solid #0E5548; }
.toc-link .toc-n { font-size:10px; color:var(--slate); min-width:14px; }

/* ── Section constat (📊) ────────────────────────────── */
.rtext h2[data-type="constat"] { color:#0E5548; border-bottom-color:#0E5548; }

/* ── Questions de suivi par chapitre ─────────────────── */
.chapter-question { display:flex; justify-content:flex-end; margin-top:8px; }
.chapter-q-chip {
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 13px; border-radius:18px;
  border:1.5px solid #0E5548; background:rgba(14,85,72,.06);
  color:#0E5548; font-size:12px; cursor:pointer; transition:all .15s;
  font-style:italic; max-width:460px; text-align:right;
}
.chapter-q-chip:hover { background:#0E5548; color:white; border-color:#0E5548; }

/* ── Texte narratif ──────────────────────────────────── */
.rtext { font-size:14px; line-height:1.8; color:var(--navy); }
.rtext h2 { font-size:15px; font-weight:700; margin:12px 0 4px; color:var(--navy);
  padding-bottom:4px; border-bottom:2px solid var(--border); display:block; }
.rtext h3 { font-size:13px; font-weight:700; margin:6px 0 3px; }
.rtext strong { font-weight:700; }
.rtext hr { border:none; border-top:1px dashed var(--border); margin:6px 0; }
.rtext .md-table { border-collapse:collapse; margin:8px 0 12px; font-size:13px; width:100%; }
.rtext .md-table th, .rtext .md-table td { border:1px solid var(--border); padding:5px 10px; text-align:left; }
.rtext .md-table th { background:var(--light-bg,#f5f6fa); font-weight:600; color:var(--navy); }
.rtext .md-table tr:nth-child(even) td { background:#f9f9fb; }
.rtext .md-table td:first-child { font-weight:500; }

/* ── Charts ──────────────────────────────────────────── */
.chart-wrap { position:relative; height:280px; margin:4px 0; }

/* ── Tables ──────────────────────────────────────────── */
.tbl-wrap { overflow-x:auto; }
.tbl-title { font-size:11px; font-weight:700; color:var(--slate);
  text-transform:uppercase; letter-spacing:.4px; margin-bottom:7px; }
.dtable { width:100%; border-collapse:collapse; font-size:12.5px; }
.dtable th { background:var(--slate-light); padding:7px 11px; text-align:left;
  font-weight:700; color:var(--navy); border-bottom:2px solid var(--border); white-space:nowrap; }
.dtable td { padding:6px 11px; border-bottom:1px solid var(--border); }
.dtable tr:last-child td { border-bottom:none; }
.dtable tr:hover td { background:var(--slate-light); }

/* ── Bloc erreur ─────────────────────────────────────── */
.error-block {
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:10px 14px; border-radius:8px;
  background:#FEF2F2; border:1px solid #FECACA;
}
.error-icon { font-size:16px; flex-shrink:0; }
.error-msg { flex:1; font-size:13px; color:#991B1B; line-height:1.5; min-width:180px; }
.error-retry {
  padding:5px 13px; border-radius:8px; border:1.5px solid #EF4444;
  background:white; color:#EF4444; font-size:12px; font-weight:600;
  cursor:pointer; transition:all .15s; white-space:nowrap; flex-shrink:0;
}
.error-retry:hover { background:#EF4444; color:white; }

/* ── Follow-ups ──────────────────────────────────────── */
.fu-section { border-top:1px solid var(--border); padding-top:10px; }
.fu-label { font-size:10px; font-weight:800; text-transform:uppercase;
  letter-spacing:.5px; color:var(--slate); margin-bottom:7px; }
.fu-list { display:flex; flex-direction:column; gap:5px; }
.fu-chip {
  display:inline-flex; align-items:center; gap:5px; padding:6px 12px;
  border-radius:18px; border:1px solid var(--blue-light); background:var(--blue-light);
  color:var(--blue-dark); font-size:12.5px; cursor:pointer; transition:all .15s;
  text-align:left; width:fit-content;
}
.fu-chip:hover { background:var(--blue); color:white; border-color:var(--blue); }

/* ── Zone de saisie ──────────────────────────────────── */
.input-area {
  padding:12px 28px 16px; background:white;
  border-top:1px solid rgba(17,24,39,0.1); flex-shrink:0;
}
.input-row { display:flex; gap:9px; align-items:flex-end; }
.qinput {
  flex:1; border:1.5px solid var(--border); border-radius:12px;
  padding:10px 14px; font-size:14px; font-family:inherit; resize:none;
  outline:none; transition:border-color .15s; color:var(--navy);
  background:#f6f7f4; min-height:46px; max-height:130px;
}
.qinput:focus { border-color:#00a99d; background:white; }
.qinput::placeholder { color:var(--slate); }
.send-btn {
  padding:10px 20px; background:#101c35; color:white; border:none;
  border-radius:12px; font-size:14px; font-weight:700; cursor:pointer;
  transition:all .15s; height:46px; display:flex; align-items:center; gap:5px;
}
.send-btn:hover:not(:disabled) { background:#1a2e4a; }
.send-btn:disabled { opacity:.5; cursor:not-allowed; }

/* ── Panneau de clarification ────────────────────────── */
.clarif-panel {
  background: linear-gradient(135deg, #EFF6FF 0%, #F0FDF4 100%);
  border: 1px solid #BFDBFE; border-radius: 10px;
  padding: 16px 18px; display: flex; flex-direction: column; gap: 14px;
}
.clarif-header { font-size: 13.5px; font-weight: 700; color: var(--navy); }
.clarif-sub { font-size: 12px; color: var(--slate); margin-top: 4px; }
.clarif-q { display: flex; flex-direction: column; gap: 7px; }
.clarif-q-text { font-size: 13px; color: var(--navy); font-weight: 600; }
.clarif-options { display: flex; flex-wrap: wrap; gap: 6px; }
.clarif-opt {
  padding: 5px 13px; border-radius: 20px;
  border: 1.5px solid var(--border); background: white;
  color: var(--navy); font-size: 12px; cursor: pointer; transition: all .12s;
}
.clarif-opt:hover:not(:disabled) { border-color: var(--blue); color: var(--blue); }
.clarif-opt.selected { background: var(--blue); color: white; border-color: var(--blue); font-weight: 600; }
.clarif-opt:disabled { cursor: not-allowed; opacity: .65; }
.clarif-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding-top: 4px; }
.clarif-launch {
  padding: 8px 18px; background: var(--blue); color: white;
  border: none; border-radius: 9px; font-size: 13px;
  font-weight: 600; cursor: pointer; transition: all .15s;
}
.clarif-launch:hover { background: var(--blue-dark); }
.clarif-skip { background: none; border: none; color: var(--slate); font-size: 12px;
  cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.clarif-done { font-size: 12px; color: var(--green); font-weight: 600; padding-top: 4px; }

/* ── Welcome ─────────────────────────────────────────── */
.welcome { display:flex; flex-direction:column; align-items:center;
  justify-content:center; flex:1; gap:18px; padding:40px; text-align:center; }
.welcome-title { font-size:20px; font-weight:700; color:var(--navy); }
.welcome-sub { font-size:13.5px; color:var(--slate); max-width:460px; line-height:1.65; }
.welcome-chips { display:flex; flex-direction:column; gap:7px; width:100%; max-width:540px; margin-top:6px; }
.wchip {
  padding:10px 16px; border:1.5px solid rgba(17,24,39,0.18); border-radius:10px;
  background:white; color:#101c35; font-size:13px; font-weight:600;
  cursor:pointer; transition:all .15s; text-align:left;
  display:flex; align-items:center; gap:9px;
  box-shadow:0 2px 8px rgba(15,23,42,0.06);
}
.wchip:hover { border-color:#00a99d; background:rgba(0,169,157,0.06); color:#00786f; }