/* ============================================================
   PHOEBUS — Surface PWA (P2-6 SL-3)
   Agent projectif "monde miroir" : lancement, dossier, passerelle.
   Styles alignes sur les tokens --sn-* (style.css / core/tokens.css).
   Self-hosted, aucune dependance externe (CSP script-src 'self').
   ============================================================ */

/* ---- Bouton flottant de lancement (FAB) ---- */
#phoebus-fab {
  position: fixed;
  right: 16px;
  bottom: 84px; /* au-dessus de la tabbar */
  z-index: 940;
  display: none; /* revele par JS quand session active */
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border: none;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--sn-violet, #6C5CE7), var(--sn-azur, #3B7DD8));
  color: #fff;
  font: 600 14px/1 -apple-system, "Segoe UI", Roboto, sans-serif;
  box-shadow: 0 6px 18px rgba(108,92,231,0.38);
  cursor: pointer;
}
#phoebus-fab:active { transform: scale(0.97); }
#phoebus-fab .phoebus-fab__icon { font-size: 18px; }

/* ---- Overlay plein ecran ---- */
#phoebus-overlay {
  position: fixed;
  inset: 0;
  z-index: 960;
  display: none;
  flex-direction: column;
  background: var(--sn-neige, #F8F9FC);
}
#phoebus-overlay.phoebus-open { display: flex; }

.phoebus-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  background: var(--sn-encre, #0A1628);
  color: #fff;
}
.phoebus-topbar__title { font: 700 16px/1.2 -apple-system, "Segoe UI", Roboto, sans-serif; display: flex; align-items: center; gap: 8px; }
.phoebus-close {
  border: none; background: rgba(255,255,255,0.12); color: #fff;
  width: 34px; height: 34px; border-radius: 8px; font-size: 20px; cursor: pointer; line-height: 1;
}

/* ---- Jauge budget (visible sur tous les ecrans PHOEBUS) ---- */
.phoebus-budget {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px; border-radius: 999px;
  background: rgba(255,255,255,0.10);
  font: 600 12px/1 -apple-system, "Segoe UI", Roboto, sans-serif;
}
.phoebus-budget__bar { width: 68px; height: 6px; border-radius: 3px; background: rgba(255,255,255,0.22); overflow: hidden; }
.phoebus-budget__fill { height: 100%; width: 0%; background: var(--sn-ambre, #F5A623); border-radius: 3px; transition: width .3s ease; }
.phoebus-budget__fill.is-high { background: var(--sn-rouge, #C0392B); }
.phoebus-budget__txt { white-space: nowrap; opacity: .95; }

/* ---- Corps defilant ---- */
.phoebus-body { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 18px 16px 40px; }
.phoebus-screen { display: none; max-width: 760px; margin: 0 auto; }
.phoebus-screen.is-active { display: block; }

.phoebus-h { font: 700 18px/1.3 -apple-system, "Segoe UI", Roboto, sans-serif; color: var(--sn-encre, #0A1628); margin: 4px 0 6px; }
.phoebus-sub { font: 400 13px/1.5 -apple-system, sans-serif; color: var(--sn-ink60, #4A5568); margin: 0 0 16px; }

/* ---- Ecran 1 : lancement ---- */
.phoebus-ask {
  width: 100%; box-sizing: border-box; min-height: 120px; resize: vertical;
  padding: 14px; border: 1px solid var(--sn-brume, #E8E9EF); border-radius: 12px;
  font: 400 15px/1.5 -apple-system, sans-serif; color: var(--sn-encre, #0A1628); background: #fff;
}
.phoebus-ask:focus { outline: 2px solid var(--sn-violet-20, rgba(108,92,231,0.2)); border-color: var(--sn-violet, #6C5CE7); }

.phoebus-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 13px 20px; border: none; border-radius: 12px; cursor: pointer;
  font: 600 15px/1 -apple-system, sans-serif;
}
.phoebus-btn--primary { background: var(--sn-violet, #6C5CE7); color: #fff; }
.phoebus-btn--primary:disabled { opacity: .5; cursor: default; }
.phoebus-btn--danger { background: var(--sn-rouge, #C0392B); color: #fff; }
.phoebus-btn--ghost { background: var(--sn-blanc, #fff); color: var(--sn-ink80, #2A3446); border: 1px solid var(--sn-brume, #E8E9EF); }
.phoebus-btn--block { display: flex; width: 100%; box-sizing: border-box; margin-top: 14px; }

/* ---- Ecran 2 : selecteur de mode ---- */
.phoebus-modes-intro { white-space: pre-wrap; font: 400 13.5px/1.6 -apple-system, sans-serif; color: var(--sn-ink80, #2A3446); background: #fff; border: 1px solid var(--sn-brume,#E8E9EF); border-radius: 12px; padding: 16px; margin-bottom: 16px; }
.phoebus-mode-cards { display: grid; gap: 10px; }
.phoebus-mode-card {
  text-align: left; padding: 14px 16px; border-radius: 12px; cursor: pointer;
  border: 1.5px solid var(--sn-brume, #E8E9EF); background: #fff;
}
.phoebus-mode-card:hover { border-color: var(--sn-violet, #6C5CE7); }
.phoebus-mode-card.is-selected { border-color: var(--sn-violet, #6C5CE7); background: var(--sn-violet-10, rgba(108,92,231,0.1)); }
.phoebus-mode-card__t { font: 700 15px/1.2 -apple-system, sans-serif; color: var(--sn-encre,#0A1628); margin-bottom: 3px; }
.phoebus-mode-card__d { font: 400 12.5px/1.45 -apple-system, sans-serif; color: var(--sn-ink60, #4A5568); }

/* ---- Ecran 3 : dossier ---- */
.phoebus-synthese { font: 500 14px/1.55 -apple-system, sans-serif; color: var(--sn-encre,#0A1628); background: var(--sn-violet-10, rgba(108,92,231,0.1)); border-left: 3px solid var(--sn-violet,#6C5CE7); border-radius: 8px; padding: 12px 14px; margin-bottom: 16px; white-space: pre-wrap; }
.phoebus-table-wrap { overflow-x: auto; border: 1px solid var(--sn-brume,#E8E9EF); border-radius: 12px; background: #fff; }
table.phoebus-table { width: 100%; border-collapse: collapse; font: 400 12.5px/1.4 -apple-system, sans-serif; }
.phoebus-table th { text-align: left; padding: 10px 12px; background: var(--sn-neige,#F8F9FC); color: var(--sn-ink60,#4A5568); font-weight: 600; border-bottom: 1px solid var(--sn-brume,#E8E9EF); white-space: nowrap; }
.phoebus-table td { padding: 10px 12px; border-bottom: 1px solid var(--sn-brume,#E8E9EF); color: var(--sn-ink80,#2A3446); vertical-align: top; }
.phoebus-table tr:last-child td { border-bottom: none; }
.phoebus-table td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.phoebus-grandeur { font-weight: 600; color: var(--sn-encre,#0A1628); }
.phoebus-delta-pos { color: var(--sn-vert,#27AE60); font-weight: 600; }
.phoebus-delta-neg { color: var(--sn-rouge,#C0392B); font-weight: 600; }
.phoebus-fiab { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 600; }
.phoebus-fiab--bon { background: rgba(39,174,96,0.14); color: var(--sn-vert,#27AE60); }
.phoebus-fiab--moyen { background: rgba(245,166,35,0.16); color: #B9770E; }
.phoebus-fiab--faible { background: rgba(230,126,34,0.14); color: var(--sn-orange,#E67E22); }
.phoebus-fiab--derive { background: var(--sn-violet-10, rgba(108,92,231,0.1)); color: var(--sn-violet,#6C5CE7); }
.phoebus-fiab--na { background: var(--sn-brume,#E8E9EF); color: var(--sn-ink40,#8E92A4); }
/* entrees dormantes / rejetees : affichees mais visuellement distinctes */
tr.phoebus-row--muted td { color: var(--sn-ink40,#8E92A4); background: repeating-linear-gradient(45deg, transparent, transparent 6px, rgba(142,146,164,0.06) 6px, rgba(142,146,164,0.06) 12px); }
tr.phoebus-row--muted .phoebus-grandeur { color: var(--sn-ink40,#8E92A4); text-decoration: line-through; }
/* ca_impact_net : mis en evidence (c'est le chiffre d'affaires) */
tr.phoebus-row--ca td { background: var(--sn-violet-10, rgba(108,92,231,0.1)); font-weight: 600; }
tr.phoebus-row--ca .phoebus-grandeur { color: var(--sn-violet,#6C5CE7); }
.phoebus-note { display:block; margin-top:4px; font-size: 11px; color: var(--sn-ink40,#8E92A4); font-style: italic; }

.phoebus-collapse { margin-top: 16px; }
.phoebus-collapse > summary { cursor: pointer; font: 600 13px/1 -apple-system, sans-serif; color: var(--sn-ink60,#4A5568); padding: 8px 0; }

/* ---- Ecran 4 : validation ---- */
.phoebus-confirm { background: #fff; border: 1px solid var(--sn-brume,#E8E9EF); border-radius: 12px; padding: 18px; }
.phoebus-warn { font: 500 13.5px/1.5 -apple-system, sans-serif; color: var(--sn-rouge,#C0392B); background: rgba(192,57,43,0.08); border-radius: 8px; padding: 12px 14px; margin-bottom: 16px; }
.phoebus-success { text-align: center; padding: 24px 12px; }
.phoebus-success__mark { font-size: 44px; }
.phoebus-success__t { font: 700 18px/1.3 -apple-system, sans-serif; color: var(--sn-vert,#27AE60); margin: 8px 0 4px; }
.phoebus-success__d { font: 400 13px/1.5 -apple-system, sans-serif; color: var(--sn-ink60,#4A5568); word-break: break-all; }

/* ---- Etats transverses ---- */
.phoebus-steps { display: flex; gap: 6px; margin-bottom: 14px; }
.phoebus-step { flex: 1; height: 4px; border-radius: 2px; background: var(--sn-brume,#E8E9EF); }
.phoebus-step.is-done { background: var(--sn-violet,#6C5CE7); }
.phoebus-spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid rgba(255,255,255,0.4); border-top-color: #fff; border-radius: 50%; animation: phoebus-spin .7s linear infinite; }
@keyframes phoebus-spin { to { transform: rotate(360deg); } }
.phoebus-loading-inline { display: flex; align-items: center; gap: 10px; padding: 14px; color: var(--sn-ink60,#4A5568); font: 500 13px/1 -apple-system, sans-serif; }
.phoebus-loading-inline .phoebus-spinner { border-color: var(--sn-brume,#E8E9EF); border-top-color: var(--sn-violet,#6C5CE7); }
.phoebus-error { color: var(--sn-rouge,#C0392B); background: rgba(192,57,43,0.08); border-radius: 8px; padding: 12px 14px; font: 500 13px/1.5 -apple-system, sans-serif; margin-top: 12px; }

/* ---- Plan d'Action (P3-2-FIX) : sections, cartes, verdict, badge, listes ---- */
.phoebus-doc { display: block; }
.phoebus-sec { margin: 0 0 22px; }
.phoebus-h2 { font: 700 15.5px/1.3 -apple-system, sans-serif; color: var(--sn-encre,#0A1628); margin: 0 0 10px; padding-bottom: 6px; border-bottom: 2px solid var(--sn-violet,#6C5CE7); }
.phoebus-h3 { font: 700 13px/1.3 -apple-system, sans-serif; color: var(--sn-violet,#6C5CE7); margin: 14px 0 6px; }
.phoebus-sub2 { font: 400 13px/1.55 -apple-system, sans-serif; color: var(--sn-ink80,#2A3446); margin: 0 0 8px; }

.phoebus-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin: 6px 0 14px; }
.phoebus-card { background: #fff; border: 1px solid var(--sn-brume,#E8E9EF); border-radius: 12px; padding: 12px; text-align: center; }
.phoebus-card__lbl { font: 700 11px/1.2 -apple-system, sans-serif; color: var(--sn-ink60,#4A5568); text-transform: uppercase; letter-spacing: .3px; margin-bottom: 6px; }
.phoebus-card__now { font: 400 13px/1.2 -apple-system, sans-serif; color: var(--sn-ink60,#4A5568); }
.phoebus-card__arrow { color: var(--sn-ink40,#8E92A4); font-size: 12px; line-height: 1.1; }
.phoebus-card__proj { font: 700 18px/1.2 -apple-system, sans-serif; color: var(--sn-violet,#6C5CE7); font-variant-numeric: tabular-nums; }

.phoebus-verdict { background: var(--sn-violet-10, rgba(108,92,231,0.1)); border-left: 3px solid var(--sn-violet,#6C5CE7); border-radius: 8px; padding: 12px 14px; margin: 8px 0 12px; }
.phoebus-verdict__lbl { font: 700 11px/1 -apple-system, sans-serif; text-transform: uppercase; letter-spacing: .4px; color: var(--sn-violet,#6C5CE7); margin-bottom: 5px; }
.phoebus-verdict__txt { font: 600 14px/1.5 -apple-system, sans-serif; color: var(--sn-encre,#0A1628); }

.phoebus-badge { display: block; text-align: center; padding: 11px 14px; border-radius: 10px; font: 700 14px/1.2 -apple-system, sans-serif; color: #fff; }
.phoebus-badge--go { background: var(--sn-vert,#27AE60); }
.phoebus-badge--test { background: #B9770E; }
.phoebus-badge--no { background: var(--sn-rouge,#C0392B); }

.phoebus-obj { background: var(--sn-neige,#F8F9FC); border: 1px solid var(--sn-brume,#E8E9EF); border-radius: 10px; padding: 12px 14px; font: 700 14px/1.4 -apple-system, sans-serif; color: var(--sn-encre,#0A1628); margin-bottom: 6px; }

.phoebus-list { margin: 4px 0 8px; padding-left: 20px; }
.phoebus-list li { font: 400 13px/1.5 -apple-system, sans-serif; color: var(--sn-ink80,#2A3446); margin-bottom: 6px; }
.phoebus-li-main { display: block; color: var(--sn-encre,#0A1628); }
.phoebus-annex { margin-top: 10px; }
.phoebus-annex-txt { padding: 12px 14px; }
.phoebus-annex-txt .phoebus-li-main { font: 400 13px/1.5 -apple-system, sans-serif; margin-bottom: 4px; }

@media (prefers-color-scheme: dark) {
  #phoebus-overlay { background: #0E1524; }
  .phoebus-ask, .phoebus-modes-intro, .phoebus-mode-card, .phoebus-table-wrap, .phoebus-confirm { background: #182238; border-color: #26324a; color: #E8ECF5; }
  .phoebus-h { color: #F1F4FA; }
  .phoebus-table th { background: #1E2A42; color: #A7B0C4; border-color: #26324a; }
  .phoebus-table td { color: #D3DAE8; border-color: #26324a; }
  .phoebus-grandeur { color: #F1F4FA; }
  .phoebus-card, .phoebus-obj { background: #182238; border-color: #26324a; }
  .phoebus-h2 { color: #F1F4FA; }
  .phoebus-sub2 { color: #C7D0E0; }
  .phoebus-card__proj { color: #A99BF5; }
  .phoebus-verdict__txt { color: #F1F4FA; }
  .phoebus-list li, .phoebus-li-main { color: #D3DAE8; }
}