/* =====================================================================
   TONTON PEINTURE — Widget chat (bulle flottante de capture de devis)
   Harmonisé à la charte via les TOKENS :root de reseau-peinture.css
   (surchargés par rp-content/<client>/brand.css — règle D8 : AUCUNE
   couleur en dur, un clone qui change brand.css change aussi le chat).
   Les fallbacks var(--x, #…) = palette TonTon (rendu identique si le
   widget est chargé hors design system). Scope `.ac-*` (aucune collision).
   JS associé : js/artisan-chat.js (logique inchangée, hérité site-widget).
   Le chat RÉCOLTE la demande et qualifie — il ne donne JAMAIS de prix.
   ===================================================================== */
.ac-root{position:fixed;right:20px;bottom:20px;z-index:99999;
  font-family:var(--body,"Inter",system-ui,Arial,sans-serif)}

/* Bulle */
.ac-bubble{display:inline-flex;align-items:center;gap:8px;background:var(--green,#1E8E5A);color:#fff;border:0;
  border-radius:999px;padding:13px 20px;font-size:14px;font-weight:600;cursor:pointer;
  box-shadow:0 14px 36px -10px rgba(17,39,30,.55);transition:background .2s,transform .12s}
.ac-bubble:hover{background:var(--green-bright,#34B57A)}
.ac-bubble:active{transform:translateY(1px)}

/* Fond grisé + flouté (overlay plein écran) — teinte dérivée de --forest-deep */
.ac-backdrop{position:fixed;inset:0;z-index:99998;background:rgba(12,44,36,.5);
  background:color-mix(in srgb, var(--forest-deep,#0C2C24) 50%, transparent);
  -webkit-backdrop-filter:blur(7px) saturate(120%);backdrop-filter:blur(7px) saturate(120%);
  display:none;animation:ac-fade .2s ease}
.ac-backdrop.ac-show{display:block}
@keyframes ac-fade{from{opacity:0}to{opacity:1}}

/* La bulle disparaît pendant la conversation */
.ac-root.ac-modal .ac-bubble{display:none}

/* Panneau = modale centrée, large */
.ac-panel{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(.98);
  width:min(720px,94vw);height:min(82vh,660px);background:var(--card,#fff);border:1px solid var(--line,#E2E8E2);border-radius:20px;
  box-shadow:0 40px 90px -30px rgba(17,39,30,.6);display:none;flex-direction:column;overflow:hidden;
  opacity:0;transition:opacity .2s ease,transform .2s ease}
.ac-panel.ac-on{display:flex;opacity:1;transform:translate(-50%,-50%) scale(1)}

/* En-tête */
.ac-head{background:var(--forest,#123F32);color:#fff;padding:16px 16px;display:flex;flex-direction:column;position:relative}
.ac-head::before{content:"";position:absolute;top:0;left:16px;right:16px;height:4px;border-radius:0 0 4px 4px;
  background:repeating-linear-gradient(90deg,var(--green-bright,#34B57A) 0 12px,transparent 12px 22px)}
.ac-head strong{font-family:var(--display,"Bricolage Grotesque","Inter",sans-serif);font-weight:800;font-size:16px;letter-spacing:-.01em}
.ac-head span{font-size:11px;opacity:.85;font-family:var(--mono,"Spline Sans Mono",monospace);letter-spacing:.04em}
.ac-close{position:absolute;right:12px;top:12px;background:transparent;border:0;color:#fff;font-size:16px;cursor:pointer;opacity:.8}
.ac-close:hover{opacity:1}

/* Journal */
.ac-log{flex:1;overflow-y:auto;padding:16px;background:var(--cream,#F8F7F2)}
.ac-msg{margin-bottom:11px;padding:11px 14px;border-radius:14px;font-size:14.5px;line-height:1.55;max-width:min(560px,88%)}
.ac-bot{background:var(--card,#fff);border:1px solid var(--line,#E2E8E2);color:var(--ink,#11271E)}
.ac-user{background:var(--green,#1E8E5A);color:#fff;margin-left:auto}
.ac-typing{color:var(--muted,#5C6B62);font-style:italic}
.ac-points{margin:6px 0 0;padding-left:18px}.ac-points li{margin:3px 0}

/* Choix rapides (chips) — cible tactile ≥44px, focus visible, contraste AA.
   Défaut : texte forest foncé sur blanc, bord vert. Sélectionné/survol : fond forest, texte blanc
   (le vert de marque #1E8E5A n'atteint pas 4,5:1 avec du blanc en texte courant → on remplit en forest). */
.ac-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.ac-chip{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;
  background:var(--card,#fff);color:var(--forest,#123F32);border:1.5px solid var(--green,#1E8E5A);
  border-radius:999px;padding:8px 15px;font-size:13.5px;font-weight:600;font-family:inherit;
  cursor:pointer;line-height:1.2;text-align:center;transition:background .15s,color .15s,border-color .15s}
.ac-chip:hover{background:var(--forest,#123F32);color:#fff;border-color:var(--forest,#123F32)}
.ac-chip:focus-visible{outline:3px solid var(--green,#1E8E5A);outline-offset:2px}
.ac-chip-sec{border-color:var(--line,#C7D2CC);color:var(--muted,#4E5B54);font-weight:500}
.ac-chip-sec:hover{background:var(--muted,#4E5B54);color:#fff;border-color:var(--muted,#4E5B54)}
.ac-chip:disabled{cursor:default}
.ac-chip.ac-chip-used{opacity:.45}
.ac-chip.ac-chip-used[aria-pressed="true"]{opacity:1;background:var(--forest,#123F32);color:#fff;border-color:var(--forest,#123F32)}

/* Porte discrète « pro / artisan ? » (sites métier, mode 'door') : aparté SOBRE sous l'accueil,
   pas une bulle bot pleine — le flux particulier reste l'axe visuel dominant. */
.ac-door{background:transparent;border:0;box-shadow:none;color:var(--muted,#4E5B54);font-size:13px;padding:2px 2px 0;margin-top:2px}
.ac-door strong{color:var(--forest,#123F32)}

/* Message « fourchette » : prix indicatif après la question état (déterministe, jamais inventé) */
.ac-quote{border-left:3px solid var(--green,#1E8E5A)}
.ac-quote strong{color:var(--forest,#123F32)}
.ac-quote-hint{margin-top:8px;font-size:12.5px;color:var(--muted,#4E5B54)}

/* Formulaire de capture */
.ac-form{display:flex;flex-direction:column;gap:7px;margin-top:10px}
.ac-form input{border:1px solid var(--line,#E2E8E2);border-radius:10px;padding:9px 11px;font-size:13.5px;font-family:inherit}
.ac-form input:focus{outline:2px solid var(--green-bright,#34B57A);outline-offset:1px;border-color:var(--green,#1E8E5A)}
.ac-form input.ac-err{border-color:#e53e3e}   /* rouge d'erreur sémantique, pas une couleur de marque */
.ac-form .ac-f-err{margin:0;font-size:12.5px;color:#e53e3e;font-weight:600}
.ac-form .ac-f-go{background:var(--green,#1E8E5A);color:#fff;border:0;border-radius:999px;padding:11px;font-weight:600;cursor:pointer;font-family:inherit}
.ac-form .ac-f-go:hover{background:var(--green-bright,#34B57A)}
.ac-form .ac-f-go:disabled{opacity:.6;cursor:default}

/* Pied de saisie */
.ac-foot{display:flex;border-top:1px solid var(--line,#E2E8E2);padding:12px;background:var(--card,#fff)}
.ac-input{flex:1;border:1px solid var(--line,#E2E8E2);border-radius:10px;padding:12px 14px;font-size:14.5px;font-family:inherit}
.ac-input:focus{outline:2px solid var(--green-bright,#34B57A);outline-offset:1px;border-color:var(--green,#1E8E5A)}
.ac-send{background:var(--green,#1E8E5A);color:#fff;border:0;border-radius:10px;margin-left:7px;padding:0 15px;cursor:pointer;font-size:15px}
.ac-send:hover{background:var(--green-bright,#34B57A)}

/* Branche SINISTRE (docs/61 : dossier assurance). Accent « alerte » = couleur SÉMANTIQUE amber
   (comme le rouge d'erreur .ac-err), pas une couleur de marque. Réutilise .ac-form / .ac-points. */
.ac-sini{border-left:3px solid #b45309}
.ac-sini strong{color:var(--forest,#123F32)}
.ac-sini-form{gap:10px}
.ac-sini-lbl{display:flex;flex-direction:column;gap:5px;font-size:12.5px;font-weight:600;color:var(--muted,#4E5B54)}
.ac-sini-lbl .ac-opt{font-weight:400;color:var(--muted,#4E5B54);opacity:.8}
.ac-sini-delai{margin-top:9px;font-size:13px;line-height:1.5;background:#fff7ed;border:1px solid #fed7aa;border-radius:10px;padding:8px 11px;color:#7c2d12}
.ac-sini-note{margin-top:9px;font-size:12.5px;line-height:1.55;color:var(--muted,#4E5B54)}
.ac-sini-note strong{color:var(--ink,#11271E)}

/* Réduction de mouvement : respecte prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
  .ac-panel,.ac-bubble,.ac-chip,.ac-backdrop{transition:none;animation:none}
}